替换div中的所有url答案

【问题标题】：Replacing all urls in a div替换div中的所有url
【发布时间】：2013-06-05 04:50:17
【问题描述】：

我正在尝试编写 javascript 代码来查找 div 中的所有 url。现在，如果 div 中的所有 url 都用空格分隔，这将非常容易，在这种情况下，我可以对 div 中的内容执行正则表达式来找到它们。但是，此外部 div 中的 url 可能位于子 div（或任何其他 html 标记）中，我也想将子 div 视为分隔符（并且我不想摆脱这些子 div）。举个例子，下面我想在id为“outer”的div中找到www.foo.com和www.bar.com：

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

这样做的好方法是什么？

【问题讨论】：

遍历DOM树，分别对待每个文本节点？
你介意使用 jQuery 吗？
stackoverflow.com/a/1732454/27862
www((?![<,\s]).)* 这应该可以。

标签： javascript html regex

【解决方案1】：

您可以对所有非文本子节点应用递归调用。

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/

【讨论】：

【解决方案2】：

尝试使用此示例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]);
}

这有助于查找所有网址。

【讨论】：

【解决方案3】：

试试这个

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);
}

这将获取所有 url 内容并将其替换为“test”。

【讨论】：