javascript 中的正则表达式以匹配 XML 标记之外答案

【问题标题】：Regular expression in javascript to match outside of XML tagsjavascript 中的正则表达式以匹配 XML 标记之外
【发布时间】：2013-03-09 22:19:52
【问题描述】：

我想在 <span class="get">habbitant morbi</span> triastbbitique 中找到“a”的所有匹配项，但标签中的“a”除外（见下文 ** 之间的“a”）。

<span class="get">h*a*bbit*a*nt morbi</span> tri*a*stbbitique.

如果我找到它们，我想替换它们，并且我想保存原始标签。

这个表达式不起作用：

var variable = "a";
var reg = new RegExp("[^<]."+variable+".[^>]$",'gi');

【问题讨论】：

我建议先获取文本内容，然后运行您的正则表达式。
您可能需要检查问题的格式。
我对您真正想要存档的内容有点迷茫。请澄清问题和语言。
你所说的“得到匹配”到底是什么意思？所有的匹配都是a - 在运行正则表达式之前你就知道了。您要更换吗？
抱歉，我的格式有问题。现在就清楚了。

标签： javascript regex

【解决方案1】：

我会推荐to not use a regular expression to parse HTML；这不是常规语法，除了简单的情况外，您都会遇到痛苦。

你的问题还是有点不清楚，但让我试着改写一下，看看我是否正确：

您想要获取 HTML 文档中给定字符串的所有匹配项，<tag> 正文中的匹配项除外？

假设您使用的是 jQuery 或类似的：

// Let the browser parse it for you:
var container = document.createElement()
container.innerHTML = '<span class="get">habbitant morbi</span> triastbbitique'
var doc_text  = $(container).text()

// And then you can just regex away normally:
doc_text.match(/a/gi)

（更好的是使用DOMParser，但这还没有广泛的浏览器支持）

如果你在 Node 中，那么你想寻找一些可以帮助你解析 HTML 节点的库（比如 jsdom）；然后就吐出所有下一个节点。

【讨论】：

这实际上并不是在解析 HTML。它对 HTML 进行标记，正则表达式非常适合。
如果 HTML 写得很好，当然可以。但是如果variable 包含&lt; 或> 并且您想在文本节点中找到它的实例怎么办？在很多情况下，浏览器不会在未转义的控制字符上闪烁，而是将它们放在文本节点中而不是形成标签。
<a>foo < bar</a> 例如。你不能假设有人对你足够好 &lt;
在任何情况下如何标记它都有一个常规语法。
@Nevir，请参阅我更新的答案以获取处理 <a>foo < bar</a> 或更糟的示例。如果您想查看一些更大的表达式，链接的内容也可能很有趣。 ;-)

【解决方案2】：

请注意，此问题与解析无关。这是词法。正则表达式经常被正确使用的东西。

如果您想使用正则表达式，有几种方法可以做到这一点。

一个简单的 hack 前瞻，例如：
```
  a(?![^<>]*>)
```
请注意，这不会正确处理标签中引用的< 和>/标签之外的未转义。
一个完整的分词器：
```
  (expression for tag|comments|etc)|(stuff outside that that i'm interested in)
```
替换为根据匹配的部分执行不同操作的函数。如果$1 匹配，它将被它自己替换，如果$2 匹配，则用*$2* 替换它

完整的分词器方式当然不是一项简单的任务，spec isn't small。

但如果简化为仅匹配基本标签，忽略 CDATA、cmets、脚本/样式标签等，您可以使用以下内容：

var str = '<span class="a <lal> a" attr>habbitant 2 > morbi. 2a < 3a</span> triastbbitique';

var re = /(<[a-z\/](?:"[^"]*"|'[^']*'|[^'">]+)*>)|(a)/gi;

var res = str.replace(re, function(m, tag, a){
    return tag ? tag : "*" + a + "*";
});

结果：

<span class="a <lal> a" attr>h*a*bbit*a*nt 2 > morbi. 2*a* < 3*a*</span> tri*a*stbbitique

现场示例：

var str = '<span class="a <lal> a" attr>habbitant 2 > morbi. 2a < 3a</span> triastbbitique';

var re = /(<[a-z\/](?:"[^"]*"|'[^']*'|[^'">]+)*>)|(a)/gi;

var res = str.replace(re, function(m, tag, a){
    return tag ? tag : "*" + a + "*";
});

console.log(res);

这会处理 HTML 中混乱的标签、引号和未转义的 </>。

使用正则表达式标记 HTML 标记的几个示例（应该可以很好地转换为 JS 正则表达式）：

【讨论】：