根据术语突出显示javascript中的搜索项

Question

例子：

我想找“时代”(百科全书)。

结果将是:百科全书，搜索结果将使用字符数->百科全书突出显示。

WIll试图澄清我的观点..。：

-> **clopedia

Encycl -> *encycl*opedia

知道怎么做吗..。？

提前谢谢。

Answer 1

如果您已经准备好使用jQuery，那么就更容易了：

var searchPattern = new RegExp(searchString, 'g');
$elem.html($elem.html().replace(searchPattern, "<ACRONYM class='srch'>" + searchString + "</ACRONYM>"));

其中，$elem是要搜索的HTML元素的jQuery对象。例如，如果它是像<div id='me'>some text</div>这样的特定div，并且您正在搜索文本"some"，那么它将如下所示：

var searchPattern = new RegExp('some', 'g');
$elem = $('#me');
$elem.html($elem.html().replace(searchPattern, "<ACRONYM class='srch'>" + searchString + "</ACRONYM>"));

为css类“srch”提供适当的突出显示样式。搜索结束后，不要忘记删除带有“srch”类的'acronym‘元素。