JS Regex to find href of several a tags

Question

I need a regex to find the contents of the hrefs from these a tags :

Answer 1

It's important to be non-greedy. And to cater for —matching— ' or "

test = "<a href="#" class="foo bar"> banana 
        <a href='http://google.de/foo?yes=1&no=2' data-href='foobar'/>"

test.replace(/href=(?:\'.*?\'|\".*?\")/gi,'');

disclaimer: The one thing it does not catch is html5 attribs data-href...

Answer 2

var str = "";

str += "<p class=\"bc_shirt_delete\">";
str += "<a href=\"/CustomContentProcess.aspx?CCID=13524&amp;OID=3936923&amp;A=Delete\" onclick=\"javascript:return confirm('Are You sure you want to delete this item?')\">delete</a>";
str += "</p>";

---

var matches = [];

str.replace(/href=("|')(.*?)("|')/g, function(a, b, match) {
  matches.push(match);
});

console.log(matches);

or if you don't care about the href:

var matches = str.match(/href=("|')(.*?)("|')/);

console.log(matches);

Answer 3

You can try this regex:

/href="([^\'\"]+)/g

Example at: http://regexr.com?333d1

Update: or easier via non greedy method:

/href="(.*?)"/g

Answer 4

You may don't need Regex to do that.

o = document.getElementsByTagName('a');
urls = Array();
for (i =0; i < o.length; i++){
   urls[i] = o[i].href;
}

If it is a plain text, you may insert it into a displayed non DOM element, i.e display: none, and then deal with it regularly in a way like I described.

Answer 5

I combined a few solutions around and came up with this (Tested in .NET):

(?<=href=[\'\"])([^\'\"]+)

Explanation:

(?<=) : look behind so it wont include these characters

[\'\"] : match both single and double quote

[^] : match everything else except the characters after '^' in here

+ : one or more occurrence of last character.

This works well and is not greedy with the quote as it would stop matching the moment it finds a quote

Answer 6

It might be easier to use jQuery

 var html = '<li><h2 class="saved_shirt_name">new shirt 1</h2><button class="edit_shirt">Edit Shirt</button><button class="delete_shirt" data-eq="0" data-href="/CustomContentProcess.aspx?CCID=13524&amp;OID=3936923&amp;A=Delete">Delete Shirt</button></li><li><h2 class="saved_shirt_name">new shirt 2</h2><button class="edit_shirt">Edit Shirt</button><button class="delete_shirt" data-eq="0" data-href="/CustomContentProcess.aspx?CCID=13524&amp;OID=3936924&amp;A=Delete">Delete Shirt</button></li><li><h2 class="saved_shirt_name">new shirt 3</h2><button class="edit_shirt">Edit Shirt</button><button class="delete_shirt" data-eq="0" data-href="/CustomContentProcess.aspx?CCID=13524&amp;OID=3936925&amp;A=Delete">Delete Shirt</button></li>';
$(html).find('[data-href]');

And iterate each node

UPDATE (because post updated)

Let html be your raw response

var matches = $(html).find('[href]');
var hrefs = [];
$.each(matches, function(i, el){ hrefs.push($(el).attr('href'));});
//hrefs is an array of matches