Javascript在HTML中搜索关键字，并用em标记将其包围

我正在寻找一种在HTML中搜索并用

标记围绕关键字的方法。我想搜索一系列定期出现在页面上的单词列表

例：搜索[foo，bar]

之前的html：

....
<li>Lorem ipsum dolor sit amet</li>
<li>consectetur FOO adipiscing elit</li>
<li>Ut at convallis nisl BAR</li>
....

。。。。
Lorem ipsum dolor sit amet
圣职足球精英
康瓦尔尼斯酒吧
....

以下内容后的html：

....
<li>Lorem ipsum dolor sit amet</li>
<li>consectetur <em>FOO</em> adipiscing elit</li>
<li>Ut at convallis nisl <em>BAR</em></li>
....

。。。。
Lorem ipsum dolor sit amet
圣职足球精英
康瓦尔尼斯酒吧
....

我正在搜索的文本在加载后将是静态的，如果有帮助，它将始终位于列表标记中，并且关键字可以在javascript中定义，因此我认为答案不应该太难找到。我在这里发现了一些类似的主题，但与我所尝试的完全不同，而且通常过于复杂，无法用我有限的技能来改变

目标是将脚本添加到一系列页面中，以避免手动编码所有强调标记，然后使用CSS设置标记样式

---

任何帮助或类似查询的链接将不胜感激

有关请求的实现，请参见下文：

// Keys
var keys = ["foo", "bar"];

// Create regular expression for a global and dynamic search and replace
var pattern = [];
for (var i=0; i<keys.length; i++) {
    // Create RegExp. This section is needed to deal with special chars
    pattern.push(keys[i].replace(/([[^$.|?*+(){}])/g, "\\$1"));
}
pattern = "\\b(" + pattern.join("|") + ")\\b";
pattern = new RegExp(pattern, "g"); //Replace g by gi for case-insensitivity

var li = document.getElementsByTagName("li");
for (var i=0, l=li.length; i<l; i++) {
    li[i].innerHTML = li[i].innerHTML.replace(pattern, "<em>$1</em>");
}

//密钥
变量键=[“foo”，“bar”]；
//为全局和动态搜索和替换创建正则表达式
var模式=[]；
对于（var i=0；i类似这样的情况：

var emKeywords = function(text, kws) {
  var regex = new RegExp("\\b(" + kws.join("|") + ")\\b", "gi");
  return text.replace(regex, function(m) {
    return "<em>" + m + "</em>";
  });
};

var htmlAfter = emKeywords(htmlBefore, ['foo', 'bar']);
htmlAfter; // => "...<em>FOO</em>...<em>BAR</em>..."

var emKeywords=函数（文本，kws）{
var regex=new RegExp（“\\b（“+kws.join（“|”）和“+”\\b”、“gi”）；
返回文本。替换（正则表达式，函数（m）{
返回“+m+”；
});
};
var htmlAfter=emKeywords（htmlBefore，['foo'，'bar']）；
htmlAfter；//=>“…FOO…BAR…”

请注意，第二个参数必须是字符串列表。此函数还将在每个单词周围设置单词边界，以确保它不会损坏“Jack Thompson被取消注册”之类的内容。
replace（/（foo | bar）/gi，function（）{$1}）
是一个jQuery插件，它或多或少能满足您的需要。我不是想把jQuery推给您，而是把它作为一些源代码提供给您查看。@qwertymk如果OP有一句话像“Jack Thompson被取消了资格”，该怎么办？这可能应该在服务器端完成。最好只翻译一次页面，而不是每次都强制重新提交（这不包括可用性问题，如禁用JS或加载后页面更改）谢谢@Pointy，我看过一些jQuery highlight插件，但是它们有点太过了，我的javascript不够流利，无法精简代码。谢谢！我做到了，谢谢！（我想还有一个额外的；在RegExp之后，我把它取出来，它工作得非常完美）。谢谢g->gi提示，我会一直遇到这个问题。