jQuery:从字符串数组创建多个跨度

Question

我有一个程序，它应该接受关键字并用CSS突出显示/着色它们。

我使用jQuery是因为我想最终更改高亮显示的单词，所有这些都由用户完成。

现在的问题不是没有任何东西被突出显示（是的），而是不是所有东西都没有被突出显示（哦，不）气球、多萝西、旋风），但通常情况下，并不是所有的单词（如果有的话）都会被着色。

希望这个jsFiddle的东西能比我更好地解释它。从第二行你会注意到，第一个单词和关键字Dorothy并不像我预期的那样是红色的。

谢谢。很抱歉，如果我太语无伦次或其他什么，请感谢

Answer 1

这就是您想要的吗？

$(function(){
     var keyWord = new Array("Dorothy","cyclone","miles","house","balloon");
     var regexp = new RegExp(keyWord.join("|"),"g");
     $('#oz li').html( function(i,value){
          return value.replace(regexp ,
               '<span containsStringImLookingFor="true" id="$&">$&</span>');
     });
});

解释

regexp是/Dorothy|cyclone|miles|house|balloon/g正则表达式，它匹配数组中列出的所有单词。.replace()方法用"<span containsStringImLookingFor="true" id="{matched word}">matched word</span>"模板替换所有匹配的单词替换方法中的$&’表示当前匹配的单词。