在HTML标签内搜索文本的正则表达式

Question

在HTML标签内搜索文本的正则表达式

5

我在使用正则表达式搜索HTML标签之间的文本时遇到了一些困难。这是为了在HTML页面上搜索文本而不将字符作为标签或属性的匹配项查找的搜索功能。当找到匹配项时，我会用一个div将其包围，并分配一个highlight类来突出显示HTML页面中的搜索词。如果RegExp还匹配标签或属性，则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>

我已经想出了当前的正则表达式：

(?<=(>))assigned(?!\<)(?!>)/gi

如果assigned或Assigned是标签文本的开头，但不在其他位置匹配。它可以很好地忽略属性和标签，但如果文本没有以搜索字符串开头，则不起作用。

有人能帮助我吗？我已经在这上面工作了一个小时，但找不到解决方案（对于RegExp来说，我是个新手..）

更新2

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

当搜索时，问题仍然存在，那就是 没有被忽略，应该忽略所有HTML实体和注释中的文本。因此，当搜索"b"时，即使HTML实体正确位于HTML标记之间，它也不应与 匹配。

- Fréderic Cox

查找位于>和下一个<之间的文本 - 类似于这样：/>([\w> ]+?)</g。Regex101 - sideroxylon

2个回答

-1

试试这个

演示实况

string.match(/<.{1,15}>(.*?)<\/.{1,15}>/g)

这意味着 <.{1,15}>(.*?)</.{1,15}> 任何在 HTML 标签

中间的内容

 <any> Content </any>

例如，将是目标或结果

 <div> this is the content </content>

"这是内容" 这是结果

- Beginner

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- revo · Accepted Answer

更新 #2

正则表达式：

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

使用方法：

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

演示

解释：

当你遇到更多不同的情况时，我必须修改正则表达式以覆盖更多可能的情况。但现在我找到了一个几乎覆盖所有情况的正则表达式。它是如何工作的：

捕获所有<script>标签及其内容
捕获所有CDATA块
捕获所有HTML标签（开放/关闭）
捕获所有HTML注释（以及IE条件语句）
在剩余文本中捕获所有目标字符串，该字符串定义在最后一组内（这里是 (e)）

这样做可以让我们快速操作我们的目标。例如，在使用部分中表示的标签中包装它。就性能而言，我尝试以良好的方式编写它。

这个正则表达式不能 100% 保证匹配正确的位置（99% 可以），但它应该大多数时候都能给出预期的结果，并且可以轻松地进行修改。