RegExp 用于搜索 HTML 标签内的文本

Fré*_*Cox 5 html regex search

我在使用 RegExp 搜索 HTML 标记之间的文本时遇到一些困难。这是一个搜索功能,用于搜索 HTML 页面上的文本,而无需在 HTML 的标签或属性中找到匹配的字符。当找到匹配项时,我用 div 包围它,并为其分配一个突出显示类,以突出显示 HTML 页面中的搜索词。如果正则表达式也匹配标签或属性,则 HTML 代码就会损坏。

HTML 代码如下:

<html>
<span>assigned</span>
<span>Assigned > to</span>

<span>assigned > to</span>

<div>ticket assigned to</div>

<div id="assigned" class="assignedClass">Ticket being assigned to</div>

</html>
Run Code Online (Sandbox Code Playgroud)

我目前提出的正则表达式是:

(?<=(>))分配(?!\<)(?!>)/gi

如果已分配或已分配是标签中文本的开头,则匹配,但在其他标签中则不匹配。它可以很好地忽略属性和标签,但如果文本不以搜索字符串开头,则效果不佳。

有人可以帮我从这里出去吗?我已经为此工作了一个小时,但找不到解决方案(这里是 RegExp noob ..)

更新2

https://regex101.com/r/ZwXr4Y/1显示了有关 HTML 实体和 HTML 注释的剩余问题。

搜索时剩下的问题是&nbsp;不被忽略,HTML 实体和注释中的所有文本都应该被忽略。因此,当搜索“b”时,&nbsp;即使 HTML 实体正确位于 HTML 标记之间,它也不应该匹配。

rev*_*evo 2

更新#2

正则表达式:

(<)(script[^>]*>[^<]*(?:<(?!\/script>)[^<]*)*<\/script>|\/?\b[^<>]+>|!(?:--\s*(?:(?:\[if\s*!IE]>\s*-->)?[^-]*(?:-(?!->)-*[^-]*)*)--|\[CDATA[^\]]*(?:](?!]>)[^\]]*)*]])>)|(e)
Run Code Online (Sandbox Code Playgroud)

用法:

html.replace(/.../g, function(match, p1, p2, p3) {
    return p3 ? "<div class=\"highlight\">" + p3 + "</div>" : match;
})
Run Code Online (Sandbox Code Playgroud)

现场演示

解释:

当您经历更多不同的情况时,我必须修改正则表达式以涵盖更多可能的情况。但现在我带来了这个几乎涵盖所有情况的产品。怎么运行的:

  • 捕获所有<script>标签及其内容
  • 捕获所有CDATA
  • 捕获所有 HTML 标签(开始/结束)
  • 捕获所有 HTML 注释(以及 IE if 条件语句)
  • 捕获剩余文本中最后一组中定义的所有目标字符串(此处为 (e)

这样做可以让我们快速操纵我们的目标。例如,将其包装在标签中,如使用部分所示。谈到性能方面,我尝试以一种性能良好的方式来编写它。

此正则表达式不能 100% 保证匹配正确的位置(99% 可以保证),但它应该在大多数情况下给出预期结果,并且可以在以后轻松修改。