如何使用正则表达式不匹配其中包含某些标签的 HTML 标签？ [复制]答案

【问题标题】：How to use regexp to not match HTML tags that have certain tags inside them? [duplicate]如何使用正则表达式不匹配其中包含某些标签的 HTML 标签？ [复制]
【发布时间】：2020-12-14 13:23:40
【问题描述】：

我有一个这样的链接，我想用正则表达式匹配：

<a href="tel:something">something</a>

我设法将它与<a[^>]+tel:.*?>.*?<\/a>匹配

但我不想匹配其中嵌套了 <span></span> 的链接：

<a href="tel:[some_numbers]"><span class="hello">Hello</span>[some_numbers]</a>

我尝试使用负前瞻(?!(<\/?span[^>]*>)) 来排除<span></span>，但它不起作用。我的正则表达式如下：

/<a[^>]+tel:.*?>(?!(<\/?span[^>]*>)).*?<\/a>/ig

【问题讨论】：

Javascript 具有原生 XPath 支持。您的 HTML 字符串的来源是什么？正则表达式实际上是零理由，除非您以某种方式处理 text() 的输出。
谢谢，我会研究 XPath！ HTML 字符串的来源：var content = document.documentElement.innerHTML;
永远不要用正则表达式解析 html。 stackoverflow.com/questions/1732348/…
@DrMe 我明白了，看看我的回答。您可以直接跳到var iterator 行。

标签： javascript html regex xpath

【解决方案1】：

您应该使用 XPath 执行此操作：

// Our HTML source
var s = `<a href="tel:something">something1</a>
<a href="tel:[some_numbers]"><span class="hello">Hello1</span>[some_numbers]</a>
<a href="tel:something">something2</a>
<a href="tel:[some_numbers]"><span class="hello">Hello2</span>[some_numbers]</a>
<a href="tel:something">something3</a>
<a href="tel:[some_numbers]"><span class="hello">Hello3</span>[some_numbers]</a>`;

// Create a root div because XML requires a single root element
var div = document.createElement('div');

// Set the innerHTML to our string
div.innerHTML = s;

// Find <a> tags with no direct child <span> tag(s)
var iterator = document.evaluate('//a[not(span)]', div, null, XPathResult.ANY_TYPE, null);

// Set the iterator
var thisNode = iterator.iterateNext();

// Loop the iterator and log the node found
while (thisNode) {
  
  console.log(thisNode);
  
  thisNode = iterator.iterateNext();
}

https://jsfiddle.net/kad3ouqL/

这应该产生：

<a href="tel:something">something1</a>
<a href="tel:something">something2</a>
<a href="tel:something">something3</a>

【讨论】：

@DrMe 太好了！如果它帮助您解决了您的问题，请随时将我的答案标记为已接受:)