如何使用正则表达式提取 HTML img 源？答案

【问题标题】：How do I extract HTML img sources with a regular expression?如何使用正则表达式提取 HTML img 源？
【发布时间】：2014-12-03 15:34:49
【问题描述】：

我需要从 HTML 文档中的所有图像标签中提取 src 元素。

因此，输入是一个 HTML 页面，输出是一个指向图像的 URL 列表：例如...http://www.google.com/intl/en_ALL/images/logo.gif

以下是我目前想出的：

<img\s+src=""(http://.*?)

这不适用于 src 不在 img 标签之后的标签，例如：

<img height="1px" src="spacer.gif">

有人可以帮助完成这个正则表达式吗？这很容易，但我认为这可能是获得答案的更快方法。

【问题讨论】：

标签： regex asp-classic vbscript

【解决方案1】：

下面的正则表达式 sn-p 应该可以工作。

<img[^>]+src="([^">]+)"

它会查找以<img 开头的文本，后跟一个或多个不是> 的字符，然后是src="。然后它会抓取该点和下一个 " 或 > 之间的所有内容。

但如果可能，请使用真正的 HTML 解析器。它更可靠，并且可以更好地处理边缘情况。

【讨论】：

它不适用于单引号标签，请记住 HTML 实际上不需要在属性上加上引号，除非它们包含空格。
如果标签以字母src 结尾也不起作用，例如，如果图像有data-src 标签，这将不起作用。
<img\s.*?src=(?:'|")([^'">]+)(?:'|") 查找以 src= 单/双引号（不捕获）；然后捕获一个或多个不是单引号/双引号或> 的内容；然后是单/双引号（不捕获）。这个适用于单引号/双引号，不会使用“src”获取其他属性，例如data-src。 phpliveregex.com/p/kDH
<img\s.*?src=(?:'|\")([^'\">]+)(?:'|\").*?\/?> 捕获整个标签，以防您需要替换它。

【解决方案2】：

你不想那样做。正确解析 HTML 是一个非常复杂的问题，而正则表达式并不是解决这个问题的好工具。

参见例如 Can you provide some examples of why it is hard to parse XML and HTML with a regex?

这里有一个很好的解决方案：

How do I programatically inspect a HTML document

【讨论】：

【解决方案3】：

您可以使用 Javascript 轻松完成此操作。一个例子如下：

var images = document.getElementsByTagName("img");

for (i=0; i < images.length; i++)
{
   // get image src
   var currImage = images[i].src;

   // do link creation here
}

【讨论】：

【解决方案4】：

这对我很有用

$regexp = '<img[^>]+src=(?:\"|\')\K(.[^">]+?)(?=\"|\')';

if(preg_match_all("/$regexp/", $content, $matches, PREG_SET_ORDER)) {

    if( !empty($matches) ) {

        for ($i=0; $i <= count($matches); $i++)

        {
            $img_src = $matches[$i][0];

            echo $img_src;

        }

    }

}

【讨论】：