javascript - 根据术语在javascript中突出显示搜索词

Question

例子 ：

我想搜索“ency”（百科全书）。

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

将尝试澄清我的观点....：

Ency -> * ency *clopedia

百科全书 - > *百科全书*百科

知道该怎么做...？

提前致谢。

Answer 1

如果你准备好使用 jQuery 那就更简单了：

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

其中，$elem是您正在搜索的 HTML 元素的 jQuery 对象。例如，如果它是一个特定的 div，<div id='me'>some text</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 ”元素。