I've a requirement where I need to extract the 1st href from a string.

Let's say I've a string this way :

var LinkString="Google Link Is:<a href='www.Google' target='_blank' style='text-decoration:none; color:#000000;'>URL</a>";

Now I need to find all the anchor tags from that string and extract the first anchor tag's href.

I've followed this sample from here and have tried finding the anchor tag from the string.

But I'm unable to get the first element's href.

var LinkString="Google Link Is:<a href='www.Google' target='_blank' style='text-decoration:none; color:#000000;'>URL</a>";
    var output = LinkString.split(/(?=<a)/)[1];

I've also tried creating a DOM element from the output anchor tag but unable to get the exact href by following the procedure from here

My requirement is to get the Google as a final output.

Can anyone help me getting the href?

I've a requirement where I need to extract the 1st href from a string.

Let's say I've a string this way :

var LinkString="Google Link Is:<a href='www.Google.' target='_blank' style='text-decoration:none; color:#000000;'>URL</a>";

Now I need to find all the anchor tags from that string and extract the first anchor tag's href.

I've followed this sample from here and have tried finding the anchor tag from the string.

But I'm unable to get the first element's href.

var LinkString="Google Link Is:<a href='www.Google.' target='_blank' style='text-decoration:none; color:#000000;'>URL</a>";
    var output = LinkString.split(/(?=<a)/)[1];

I've also tried creating a DOM element from the output anchor tag but unable to get the exact href by following the procedure from here

My requirement is to get the Google. as a final output.

Can anyone help me getting the href?

• javascript
• jquery
• html
• anchor

3 Answers 3

You have to use a virtual html element such as div to place the html string value in it then you can target the anchor to extract the href:

var htm="Google Link Is:<a href='www.Google.' target='_blank' style='text-decoration:none; color:#000000;'>URL</a>";
var href = $('<div>').append(htm).find('a:first').attr('href');
console.log(href)

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>

You can create DOM element then extract the anchor

var LinkString="Google Link Is:<a href='www.Google.' target='_blank' style='text-decoration:none; color:#000000;'>URL</a>";
var firstAnchor = $('<div></div>').append(LinkString).find('a:first');
console.log(firstAnchor.prop('outerHTML')); //Get HTML
console.log(firstAnchor.attr('href')); //Get href attribute
console.log(firstAnchor.prop('href')); //Get href property

<script src="https://ajax.googleapis./ajax/libs/jquery/2.1.1/jquery.min.js"></script>

You can do this way jsfiddle:

var LinkString="Google Link Is:<a href='www.Google.' target='_blank' style='text-dec`oration:none; color:#000000;'>URL</a>";

var dom = jQuery.parseHTML("<div>" + LinkString + "</div>");
console.log(dom);
console.log($(dom).find("[href]").attr("href"));

This searches for dom elements that have the href attribute and prints the first href found.