javascript - 正则表达式使链接可点击(仅在 'a href' 而不是 'img src' )

Question

我一直在努力寻找问题的稳定解决方案。 我需要将字符串中的所有 http/https 链接设置为可点击链接。但仅限于“a”标签的“href”属性中的链接，而忽略其他所有内容。

我一直在使用这个简单的函数来链接文本 -

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

但问题是它也将任何“img”标签的“src”属性中的链接转换为可点击链接。这是我不想要的。 我需要链接的字符串可以包含“a”和“img”标签。

我什至提到了这个链接 - How to replace plain URLs with links?并使用了这个 - https://github.com/cowboy/javascript-linkify ，但仍然没有运气。

由于我使用 angular.js，我还使用内置的“linky”过滤器( https://docs.angularjs.org/api/ngSanitize/filter/linky )来链接文本，但问题仍然存在。

上述所有解决方案都链接“a”和“img”标签中的文本。

寻求帮助!谢谢。

Answer 1

JavaScript 缺乏对正则表达式中的负向后查找的支持。这是简单的解决方法:

var content = '<a href="http://google.com">Google.com</a> and http://google.com';

var re = /((?:href|src)=")?(\b(https?|ftp|file):\/\/[-A-Z0-9+&@#\/%?=~_|!:,.;]*[-A-Z0-9+&@#\/%=~_|])/ig;

content = content.replace(re, function (match, attr) {
    if (typeof attr != 'undefined') {
        return match;
    }
    return '<a target="_blank" href="' + match + '">' + match +'</a>';
});

但是您应该避免使用 RegExp 解析 HTML。 Here's why .