如何检测数据：图像标签答案

【问题标题】：How to detect data:image tag如何检测数据：图像标签
【发布时间】：2016-05-22 07:40:42
【问题描述】：

我有summernote所见即所得插件，现在每当我添加任何图像时，它都会将图像转换为

<img data-filename="Untitled-1.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoUAAAELCAIAAAAgGWu2AA" style="width: 645px;">

现在我只想检测第一个标签并获取它的 src 值并将其存储在数据库中以将其显示为特色图像

例如，如果有两个 img 数据文件名标签

<img data-filename="Untitled-1.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoUAAAELCAIAAAAgGWu2AA" style="width: 645px;">

<img data-filename="Untitled-2.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoUAAAELCAIAAAAgGWu2AA" style="width: 645px;">

我只想获取 Untitled-1.png 的 src 值，而不是 Untitled-2.png，

这是我尝试过的

preg_match('/(<img .*?>)/', $go, $img_tag);
$feature = $img_tag[0];

【问题讨论】：

标签： php regex preg-match preg-match-all

【解决方案1】：

使用 DOMDocument 和 DOMXPath 使用 HTML 结构轻松定位您想要的内容：

$content = <<<'EOD'
<img data-filgename="Untitled-1.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoUAAAELCAIAAAAgGWu2AA" style="width: 645px;">
<img data-filgename="Untitled-2.png" src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAoUAAAELCAIAAAAgGWu2AA" style="width: 645px;">
EOD;

$dom = new DOMDocument;
$dom->loadHTML($content);

$xp = new DOMXPath($dom);

$result = $xp->evaluate('string(//img[@data-filename]/@src)');
#     img node anywhere --------^    ^                ^---- src attribute
#     in the DOM tree                '---- predicate: must have a 
#                                                     data-filename attribute

if (!empty($result))
    echo $result, PHP_EOL;

【讨论】：