javascript - jQuery实现搜索结果关键字高亮显示

Question

很多网站的搜索结构页面，都会将搜到的关键字高亮显示。似乎是在关键字外围包裹一个标签如<em class="highlight">hello</em>，那么，这个关键词用jQuery该如何匹配到呢？

Answer 1

这样的效果早已有现在的jQuery扩展了，匹配链接中的文字也是妥妥的。

Answer 2

是个比较复杂的问题，可以找jquery插件，提供一个我修复过的插件，这个插件我也找不到原版了，而且代码都是压缩了的，好在还简单，如果要修改的话也不复杂
http://jsfiddle.net/UWH7K/

Answer 3

用JS将文本中某些关键字wrap一个标签是很容易的事情，有几位同学都提供了答案。
回到问题本身，你应该不是要知道怎么用JS包装标签，而是要知道怎么高亮,方法有多种，根据你不同的业务场景选择。
1. 一般简单的搜索结果页的高亮标签用JS在客户处理，没有问题。比如wordpress的一些高亮插件；
2. 运用分词技术进行搜索的，比如，我在Google搜索“美国人民生活在水深火热中”，我得到的第一条搜索结果

这样的结果，采用JS处理显然不太合适，关键问题，你不知道“美国人民”是被分成了"美国"，“美国人”还是“美国人民”，所以一般都会在处理分词的时候来高亮，或者告诉你怎么高亮，你可以去了解了解Lucene

Answer 4

高亮的文字的jQuery对象可以通过

$("span[rel='mark']")

获取。
然后使用textSearch，具体为：

$(选择器). textSearch(String,可选参数)