用img标签替换图片网址

时间:2015-05-25 13:58:39

标签: php html

我正在尝试用img标签替换字符串中的URL。

我有这个工作,但它也替换了锚标记内的URL。

如果我有:

 $string = 'Hi, https://example.com/logo.png,
     <a href="https://example.com/banner.png">https://example.com/banner.png</a>';

它看起来像:

Hi, <img src="https://example.com/logo.png" />,
     <a href="<img src="https://example.com/banner.png" />"><img src="https://example.com/banner.png" /></a>

这就是我用来替换的东西:

return preg_replace_callback('/https?:\/\/(.*?)\.(jpg|png|gif)(\?\w+=\w+)?/i',    function($matches){ 
        return '<img src="'.$matches[0].'" />'; 
}, $string);

如何让它忽略锚标签。

谢谢。

2 个答案:

答案 0 :(得分:1)

不要直接使用正则表达式进行HTML操作。相反,您可以使用end来使用DOM操作。查找HTML字符串中的所有文本节点,并安全地用图像标记替换图像URL。

DOMDocument

<强>输出:

<?php

$string = 'Hi, https://example.com/logo.png,
<a href="https://example.com/banner.png">https://example.com/banner.png</a>';

$dom = new DOMDocument();

// This loads the HTML string in a special way to handle utf and 
// not append any extra HTML tags
$dom->loadHtml(mb_convert_encoding($string, 'HTML-ENTITIES', "UTF-8"), LIBXML_HTML_NOIMPLIED | LIBXML_HTML_NODEFDTD);

// Get the text nodes
$xpath = new DOMXPath($dom);
foreach($xpath->query('//text()') as $node) {
    // Replace the text nodes with the replaced HTML fragments
    $replaced = preg_replace('/(https?:\/\/[^ ]+?(?:\.jpg|\.png|\.gif))/', '<img src="$1" alt="$1" />', $node->data);
    $frag = $dom->createDocumentFragment();
    $frag->appendXML($replaced);
    $node->parentNode->replaceChild($frag, $node);
}

echo $dom->saveHtml();

如果您想要在锚点之间排除图像URL,也可以使用

<p>Hi, <img src="https://example.com/logo.png" alt="https://example.com/logo.png">,
<a href="https://example.com/banner.png"><img src="https://example.com/banner.png" alt="https://example.com/banner.png"></a></p>

<强>输出:

$xpath->query('//text()[not(ancestor::a)]');

我用这个正则表达式来演示。请为您的目的修改它。

<p>Hi, <img src="https://example.com/logo.png" alt="https://example.com/logo.png">,
<a href="https://example.com/banner.png">https://example.com/banner.png</a></p>

答案 1 :(得分:0)

首次尝试使用negative look-behind and positive look-ahead检查图片是以"开头还是以"结尾。

$pattern = '/(?<!")https?:\/\/(.*?)\.(jpg|png|gif)(?!")(\?\w+=\w+)?/i';
return preg_replace_callback( $pattern, function( $matches ) { 
    return '<img src="'.$matches[0].'" />'; 
}, $string);

希望这有帮助。