Replacing all urls in a div

Question

I am trying to write javascript code to find all the urls inside a div. Now this would be pretty easy if all the urls within the div were separated by spaces in which case I can just do a regex on what's inside the div to find them. However, the urls within this outer div may be in sub divs (or any other html tag) and I want to consider the subdivs as separators as well (and I don't want to get rid of these subdivs). To give an example, in the following I want to find www.foo.com and www.bar.com within the div with id "outer":

<div id="outer"><div>www.foo.com</div>www.bar.com</div>

What would be a good way of doing this?

Walk over the DOM tree and treat each text node separately? – Passerby Jun 05 '13 at 04:53 — Passerby, Jun 05 '13 at 04:53
Would you mind using jQuery ? – codeVerine Jun 05 '13 at 05:19 — codeVerine, Jun 05 '13 at 05:19
http://stackoverflow.com/a/1732454/27862 – user123444555621 Jun 05 '13 at 05:44 — user123444555621, Jun 05 '13 at 05:44
`www((?![<,\s]).)*` This should work. – Mr_Green Jun 05 '13 at 06:26 — Mr_Green, Jun 05 '13 at 06:26

score 3 · Accepted Answer · answered Jun 05 '13 at 05:59

You can apply a recursive call to all non-text child nodes.

function replaceWwwInNodes(node) {
    //text node
    if (node.nodeType === 3) {
        node.textContent = node.textContent.replace(/* ??? */)
    }
    else {
        Array.prototype.forEach.call(node.childNodes, function (elem) {
            replaceWwwInNodes(elem);
        });
    }
}

replaceWwwInNodes(document.getElementById('outer'));

http://jsfiddle.net/UDX5V/

score 0 · Answer 2 · answered Jun 05 '13 at 05:52

Try to use this sample http://jsfiddle.net/iklementiev/TaCx9/1/

var data = document.getElementById("outer").innerText;
var myRe = /www\.[0-9a-z-]+\.[a-z]{2,4}/igm;
var matches=  data.match(myRe)

for (var i = 0; i < matches.length; i++) {
    alert('match: ' + matches[i]);
}

this help to find all urls.

Mathi · Answer 3 · 2013-06-05T06:18:43.660

try this

var expression = /[-a-zA-Z0-9@:%_\+.~#?&//=]{2,256}\.[a-z]{2,4}\b(\/[-a-zA-Z0-9@:%_\+.~#?&//=]*)?/gi;
 var regex = new RegExp(expression);
var regContent = $("#outer").html();
var newContent = regContent;                                                                     
if(regContent.match(regex))
{    
    var textContent = regContent.match(regex);                                                                         
for(var i=0;i<regContent.match(regex).length;i++)
{
    newContent = newContent.replace(new RegExp(regContent.match(regex)[i], "g"), "test");
}    
$("#outer").html(newContent);
}

this will get all url content and replace it as "test".

Replacing all urls in a div

3 Answers3