正则表达式匹配网址,但不是超链接中的网址

时间:2012-08-08 11:48:15

标签: javascript regex

我正在尝试包装某些文本中的任何网址并将其转换为超链接...但我不想包装已经被超链接包裹的网址。

例如:

<a href="http://twitter.com">Go To Twitter</a>
here is a url http://anotherurl.com

以下代码:

function replaceURLWithHTMLLinks(text) {
  var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
  return text.replace(exp, "<a href='$1'>$1</a>");
}

提供以下输出:

<a href="<a href='http://twitter.com/twitter'>http://twitter.com/twitter</a>">@BIR</a>
<a href="http://anotherurl.com">http://anotherurl.com</a>

如何修改正则表达式以排除已经超链接的网址?

由于

答案:

新方法是:

function replaceURLWithHTMLLinks(text) {
  var exp = /(?:^|[^"'])((ftp|http|https|file):\/\/[\S]+(\b|$))/gi
  return text.replace(exp, " <a href='$1'>$1</a>");
}

以上代码按要求运行。我从注释中的链接修改了正则表达式,因为它包含一个包含完整停止的错误,它现在排除了完整网址后的任何完整停靠。

1 个答案:

答案 0 :(得分:2)

javascript doesn't seem to support negative look-behind开始,您将不得不使用替换功能来欺骗它。 捕获href(也许您还应该考虑src):

function repl(text) {
  var exp = /((href|src)=["']|)(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;
  return text.replace(exp, function() {
    return  arguments[1] ? 
            arguments[0] : 
            "<a href=\"" + arguments[3] + "\">" + arguments[3] + "</a>"
  });
}

请参阅demo

修改

“更好”的版本,它只会替换实际文本节点中的链接:

function repl(node) {
  var exp = /(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/i;
  var nodes=node.childNodes;
  for (var i=0, m=nodes.length; i<m; i++){
    var n=nodes[i];
    if (n.nodeType==n.TEXT_NODE) {
      var g=n.textContent.match(exp);
      while(g) {
        var idx=n.textContent.indexOf(g[0]);
        var pre=n.textContent.substring(0,idx);
        var t=document.createTextNode(pre);
        var a=document.createElement("a");
        a.href=g[0];
        a.innerText=g[0];
        n.textContent = n.textContent.substring(idx+g[0].length);
        n.parentElement.insertBefore(t,n);
        n.parentElement.insertBefore(a,n);
        g=n.textContent.match(exp);
      }
    }
    else {
      repl(n);
    }
  }
}

var r=repl(document.getElementById("t"))

请参阅demo