Javascript 如何突出显示&；标签用完了吗？

我正在开发WebApp。我要快速搜索文章

简言之，结构是：

• 页面
• 全局数组（json，100-150项），包含由ajax获取的文章。（带有字段：id、标题、代码段）。标题和代码段可能包含简单样式标记

因此，当用户在弹出的quicksearch字段中键入查询时，应用程序

在全局数组中搜索

如果找到匹配项，

将

推送到临时搜索结果数组（带缓存）

在temp中突出显示匹配项。结果数组并显示给用户

正如您所看到的，原始数组不会进行修改

当前我使用的是primitive

String.indexOf

，但它无法匹配通过html标记文本格式化的文本（如下示例）：

---

问题是关于正则表达式模式。我清楚地理解，不建议使用正则表达式来处理DOM，下面的预期结果在语义上并不正确，但它符合需要

例如： 我们有这样的东西：

项目Y

我们需要突出显示查询

e

，期望结果：

。。。项…

，但如果使用平凡的

替换（/e/ig，$&'）

它也将替换

style=“color:red”

中的

e

i、 e.什么正则表达式模式不接触标签中的单词

---

---

第二个示例：我们需要突出显示

项Y

，因此预期结果是

项Y

一个简短的黑客解决方案是在搜索字符串的每个字母之间查找标记。如果您的关键字为“搜索”，则如下所示：

（s）（]*>）*（e）（]*>）*（a）（]*>）*（r）（]*>）*（c）（]*>）*（h）

但实际上你需要做的不止这些，因为：

• 剧本
• 文本区

• 显示：无

  ，

  可见性：隐藏

  等

---

如果我理解正确，您需要在DOM树片段的文本内容中进行搜索。实现这一点的一种方法是使用XML/HTML文本内容。此示例使用jQuery，但该思想很容易移植到其他LIB：

HTML:

---

现在，

results

将保存搜索字符串中出现的所有内容。当然，要实现突出显示结果的目标，您必须进一步执行几个步骤（例如使用RegExp.exec获取匹配的偏移）。

如上所述，数据中没有要搜索的标记。带有简单样式标记的文本。第一个示例的这个正则表达式（标记中的匹配文本）和第二个示例的这个正则表达式。notify@grigore:）的伪注释我根本没有测试过，它只是它应该是什么样子；请看，匹配<代码>这些是我的搜索关键词，如果你要把我的搜索包在“代码> <代码>标签中（实际上没有包装每一个字符），你最终会在另一个标签的中间，在不同的DOM树级别上。“我清楚地明白，不推荐使用正则表达式”…不，你显然没有。使用HTML解析器。

<div id="article_contents">
Blah blah blah, Item 1, Item 2 blah blah <b>Ite</b>m <span>1</span> blah blah
</div>

var source = jQuery('#article_contents').text();
var queryRegexp = new RegExp ( 'Item 1', 'g' );
var results = source.match (queryRegexp);