Adding a negative lookahead to a URL matching Regex

Question

So I'm tryin to replace all text URLs in multiple elements on my page with that URL in anchor tags:

http://google.com => <a target="_blank" href="http://google.com">http://google.com</a>

var titles = document.querySelectorAll(".title");
var l = titles.length, i, title;
    for(i = 0; i < l; i++) {
    console.log('foo')
    title = titles[i];
    title.innerHTML = title.innerHTML.replace(/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig,"<a target='_blank' href='$1'>$1</a>")
}

The problem is I have to run the regex again after some AJAX comes back and it's re-applying the anchor tags to the urls in the href="" attribute of the anchor tags! So I need to add a negative lookahead to this regex that prevents it from matching any urls with a trailing " or '.

Do match http://google.com but don't match "http://google.com"

/(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig

score 2 · Accepted Answer · edited May 23 '17 at 12:12

2

The general lookahead technique to assert that something is not inside double quotes is to check that there is an even number of them until the end of the string:

yourPatternHere(?=[\s\S]*(?:"[\s\S]*"[\s\S])*$)

But you are operating on HTML. This may cause all sorts of problems (unmatched quotes in text nodes, comments, single quote delimited attribute values and so on). Don't use regular expressions to parse HTML. Instead use JavaScript's built-in DOM manipulating capabilities as far as possible. Don't just find the .title elements, but traverse their text nodes instead and apply the replacement only to those.

edited May 23 '17 at 12:12

Community

1
1

answered Dec 02 '12 at 13:03

Martin Ender

43,427
11
90
130

I tried switching to the function provided here: http://jsfiddle.net/mAJkL/ which transverses DOM nodes, is this what I should be using? – alt Dec 02 '12 at 13:27
@JacksonGariety that looks better, yes – Martin Ender Dec 02 '12 at 13:41

Adding a negative lookahead to a URL matching Regex

1 Answers1