javascript - 用链接替换 ​​url 但增加了难度

Question

在一个可编辑的 iframe 中，由于这个正则表达式，我用链接替换了普通的 url：

function linkify(text) {
    var regex = /(http|https|ftp)\:\/\/[a-zA-Z0-9\-\.]+\.[a-zA-Z]{2,3}(:[a-zA-Z0-9]*)?\/?([a-zA-Z0-9\-\._\?\,\'\/\\\+&%\$#\=~])*/g;
    return text.replace(regex,"<a href='$&'>$&</a>");
}

var content = linkify($('.div').html());

当我尝试“链接”包含链接的字符串时，我的问题出现了，它会创建一个像这样的怪物：

<a href="&lt;a href='http://google.com'&gt;http://google.com&lt;/a&gt;"></a><a href="http://google.com">http://google.com</a>

我认为如果我遍历 DOM 而不是分析 html 字符串，则可以解决这个问题，但在尝试之前，我想在这里询问是否有人有任何想法。

谢谢！

Answer 1

我有一个类似的问题，并通过首先剥离 html 标签来解决它：

function strip_tags(str, allow) {
allow = (((allow || "") + "").toLowerCase().match(/<[a-z][a-z0-9]*>/g) || []).join('');

var tags = /<\/?([a-z][a-z0-9]*)\b[^>]*>/gi;
var commentsAndPhpTags = /<!--[\s\S]*?-->|<\?(?:php)?[\s\S]*?\?>/gi;
return str.replace(commentsAndPhpTags, '').replace(tags, function ($0, $1) {
return allow.indexOf('<' + $1.toLowerCase() + '>') > -1 ? $0 : '';
});
}

然后运行 ​​urlify 函数：

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

看看我的小提琴试试看：http: //jsfiddle.net/gerbenzomp/UJMeR/3/