Question

我知道这里已经讨论了这个问题，但没有解决方案提供确切的问题。请看看......

我正在使用一个函数将纯文本URL转换为可点击的链接。这就是我所拥有的：

<script type='text/javascript' language='javascript'>

window.onload = autolink;

function autolink(text) {

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

document.body.innerHTML = document.body.innerHTML.replace(exp,"<a href='$1'>$1</a>"); 

}

</script>

这使得

https://stackoverflow.com/

看起来像：

https://stackoverflow.com/

它可以工作，但也可以用嵌套链接替换现有的HTML链接。

所以，像

这样的有效HTML链接

<a href="https://stackoverflow.com/">StackOverflow</a>

变得像凌乱的东西：

<a href="https://stackoverflow.com/<a href="https://stackoverflow.com/">StackOverflow</a>">StackOverflow</a>...

如何修复表达式以忽略链接标记的内容？谢谢！

我是新手......我几乎不了解正则表达式代码。请温柔:)再次感谢。

Answer 1

使用jQuery JavaScript library，这看起来像（http://jsfiddle.net/BRPRH/4处的演示）：

function autolink() {
    var exp = /(\b(https?|ftp):\/\/[-A-Z0-9+\u0026@#\/%?=~_|!:,.;]*[-A-Z0-9+\u0026@#\/%=~_|])/gi,
        lt = '\u003c',
        gt = '\u003e';

    $('*:not(a, script, style, textarea)').contents().each(function() {
        if (this.nodeType == Node.TEXT_NODE) {
            var textNode = $(this);
            var span = $(lt + 'span/' + gt).text(this.nodeValue);
            span.html(span.html().replace(exp, lt + 'a href=\'$1\'' + gt + '$1' + lt + '/a' + gt));
            textNode.replaceWith(span);
        }
    });
}

$(autolink);

编辑：排除的textareas，脚本和嵌入式CSS。我注意到这也可以使用pure DOM's splitText完成，其优点是不添加额外的span元素。

编辑2 ：删除所有＆符号和双引号。

编辑3：摆脱＆lt;和＆gt;人物也是如此。

Answer 2

这个问题超出了正则表达式的强大功能。您可以编写一个可以避免某些链接的正则表达式，但是您将无法避免每个现有链接。

好消息是，采用不同的方法可以使工作变得更加容易。现在，您使用document.body.innerHTML将HTML作为纯文本进行操作。要以这种方式正确地执行，您基本上需要自己解析HTML。但是你没必要，因为浏览器已经为你解析了它！

Web浏览器允许您将HTML文档作为一系列对象进行访问。它被称为文档对象模型（DOM），如果你对它进行一些阅读，你应该能够学习如何遍历HTML，跳过A元素内的任何内容，并且只使用纯文本的正则表达式。

除非已有链接，否则将URL转换为链接

2 个答案: