Question

由于缺乏REGEX经验，我一直在为此苦苦挣扎。我需要提取出现在p标签内的html中所有img标签的模式。即：

<p>Hello <img src="bbc.co.uk" /> World</p>
<img src="google.com" />
<p>Crazy <img src="google.com"> Town</p>

应返回：

<img src="bbc.co.uk" />
<img src="google.com">

到目前为止，我有这个正则表达式可以捕获img模式：

<img .+?(?=>)>

但是它捕获了所有的img，因为我只需要出现在p标签中的那些，而又不希望p标签包含在结果中。

非常感谢

Answer 1

如果您的编程语言或工具支持使用正则表达式捕获组，则可以使用<p[^>]*>[^<]*(?:<[^>]*>[^<]*)*?(<img[^>]*>)[^<]*(?:<[^>]*>[^<]*)*?</p>仅捕获img标记中的p标记。

以Python为例：

import re
html = '''<p>Hello <img src="bbc.co.uk" /> World</p>
<img src="stackoverflow.com" />
<p>Crazy <img src="google.com"> Town</p>'''
print(re.findall(r'<p[^>]*>[^<]*(?:<[^>]*>[^<]*)*?(<img[^>]*>)[^<]*(?:<[^>]*>[^<]*)*?</p>', html, re.IGNORECASE | re.DOTALL))

这将输出：

['<img src="bbc.co.uk" />', '<img src="google.com">']

Answer 2

尝试 <p>.*(<img[^>]*>).*<\/p>

使用内部()组进行捕获

Answer 3

不能。 HTML是一种无上下文的语言，正则表达式只能表示正则语言。

编辑：您可能可以使用一个图像标签，但是如果期望标签数量动态变化，则不能使用一个正则表达式来实现。

Answer 4

您可以使用not advisable代替使用正则表达式DOMParser解析html。

let parser = new DOMParser();
let html = `<p>Hello <img src="bbc.co.uk" /> World</p>
<img src="google.com" />
<p>Crazy <img src="google.com"> Town</p>`;
let doc = parser.parseFromString(html, "text/html");
let imgs = doc.querySelectorAll("p img");
imgs.forEach((img) => {
  console.log(img.outerHTML)
});

如何使用正则表达式捕获<p>中的所有图像？

4 个答案: