在span标记中换行文本

Question

我正在写一个chrome扩展，它将改变屏幕上某些单词的颜色。我很难找到符合我需要的文本，然后准确地将它包装成一个跨度。html中的同一个单词通常会在页面的其他位置被替换，从而使链接和样式变得毫无用处。

我的示例代码如下：

var reArray = ['number', 'numbers'];
var re = new RegExp('\\b('+reArray.join('|')+')\\b', 'gi');
$('p, span').each(function(){
  $(this).html($(this).html().replace(re, '<span class="gold">$1</span>'));
});

Answer 1

原来，下面的正则表达式在主体中进行替换时起作用。

(>[^<]*?)\\b(words|you|want|to|search|for)\\b

我的替换文本如下：

$1<span class="gold">$2</span>

有关的完整代码：

var reArray = ['number','numbers'];
var re = new RegExp('(>[^<]*?)\\b('+reArray.join('|')+')\\b', 'gi');
$('body').each(function(){
  $(this).html($(this).html().replace(re, '$1<span class="gold">$2</span>'));
});