使用 RegEx 匹配字符串列表

【问题标题】：Match a list of strings using RegEx使用 RegEx 匹配字符串列表
【发布时间】：2016-07-25 15:12:09
【问题描述】：

我有一个函数可以在 AngularJS 中突出显示字符串中任意数量的单个单词。我想更改它，以便它突出显示我在数组中输入的任何单词，但我不确定如何使用 RegExp。这是当前的正则表达式：

$scope.highlight = function(haystack) {
    return $sce.trustAsHtml(haystack.replace(new RegExp(needle, "gi"), function(match) {
        return '<span class="highlightWord">' + match + '</span>';
    }));
};

当前的“needle”变量只是一个普通字符串，例如“cats”，但我想更改它，使其包含['cats', 'registered', 'dog'] 等。

【问题讨论】：

标签： javascript angularjs regex

【解决方案1】：

使用join()方法通过管道|连接数组元素，这是正则表达式中的OR运算符。

另外，您可以使用$& 来获取匹配的字符串并在替换字符串中使用它。

$scope.highlight = function (haystack) {
    return $sce.trustAsHtml(haystack.replace(new RegExp(needle.join('|'), "gi"), '<span class="highlightWord">$&</span>'));
};

var arr = ['cat', 'dog', 'elephant'];
var str = 'Cat fears dog and dog fears elephant';

document.body.innerHTML = str.replace(new RegExp(arr.join('|'), 'gi'), '<span class="highlightWord">$&</span>');

.highlightWord {
  background: yellow;
}

要匹配精确的单词，请使用单词边界\b。

str.replace(new RegExp('\\b(' + arr.join('|') + ')\\b', 'gi'), '<span class="highlightWord">$1</span>')

【讨论】：