jquery - 如何用每次出现的数组元素替换 Div 文本

Question

数组包含以下元素 1.abc 2.def 3.ghi

div 文本

this is abc - def some text 

我想用<p> abc</p>这样的方式替换每次出现所以最终的字符串如下所示。

this is <p>abc</p> - <p>def</p> some text 

我有一个数组元素。我必须在 div 中添加一些文本。我想使用没有循环的正则表达式用 div 文本替换 arrary 元素的每个出现。我使用两种方法完成了如下操作

方法 #1 使用 Grep

jQuery.grep(Words, function (val) {
    if (val != null && val != '') {
        Str = Str.replace(val, "<span class='abc'>" + val + "</span>");
    }
});

方法 #2 使用循环。

$.each(Words, function (keyIndex, val) {
    if (val != null && val != '')
         Str = Str.replace(val, "<span class='abc'>" + val + "</span>");
});

Answer 1

关于什么

var string = 'this is abc - def some text ';
var array = ['abc', 'def', 'ghi'];

var regex = new RegExp('\\b' + array.join('\\b|\\b') + '\\b', 'g');

var as =string.replace(regex, function(a, b){
    return '<p>'+a+'</p';
});
console.log(as)

演示：小提琴