How to using preg_replace class and src on img tag in php?

Question

I have a example:

<a href="http://test.html" class="watermark" target="_blank">
   <img width="399" height="4652" src="http://test.html/uploads/2013/10/10.jpg" class="aligncenter size-full wp-image-78360">
</a>

I using preg_replace to change value class of a tag and src of img tag

$content = preg_replace('#<a(.*?)href="([^"]*/)?(([^"/]*)\.[^"]*)"([^>]*?)><img(.*?)src="([^"]*/)?(([^"/]*)\.[^"]*)"([^>]*?)></a>#', '<a href=$2$3 class="fancybox"><img$1src="http://test.html/uploads/2013/10/10_new.jpg"></a>', $content);

How to result is ?

<a href="http://test.html" class="fancybox" target="_blank">
    <img width="399" height="4652" src="http://test.html/uploads/2013/10/10_new.jpg" class="aligncenter size-full wp-image-78360">
</a>

So to simplify - you want to find `` elements with a class of `watermark` and change the class to `fancybox`, then append the contained ``'s src filename with `_new` ? — MDEV, Oct 10 '13 at 08:24

MDEV · Accepted Answer · 2013-10-10T09:00:19.113

Regex, as is mentioned many times daily here on SO, is not the best tool for HTML manipulation - luckily we have the DOMDocument object!

If you're supplied with just that string you can make the changes like so:

$orig = '   <a href="http://test.html" class="watermark" target="_blank">
                <img width="399" height="4652" src="http://test.html/uploads/2013/10/10.jpg" class="aligncenter size-full wp-image-78360">
        </a>';
$doc = new DOMDocument();
$doc->loadHTML($orig);
$anchor = $doc->getElementsByTagName('a')->item(0);
if($anchor->getAttribute('class') == 'watermark')
{
    $anchor->setAttribute('class','fancybox');
    $img = $anchor->getElementsByTagName('img')->item(0);
    $currSrc = $img->getAttribute('src');
    $img->setAttribute('src',preg_replace('/(\.[^\.]+)$/','_new$1',$currSrc));
}
$newStr = $doc->saveHTML($anchor);

Else if you're using a full document HTML source:

$orig = '<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <title></title>
</head>
<body>
    <a href="http://test.html" class="watermark" target="_blank">
        <img width="399" height="4652" src="http://test.html/uploads/2013/10/10.jpg" class="aligncenter size-full wp-image-78360">
    </a>
    <span>random</span>
    <a href="http://test.html" class="watermark" target="_blank">
        <img width="399" height="4652" src="http://test.html/uploads/2013/10/10.jpg" class="aligncenter size-full wp-image-78360">
    </a>
    <a href="#foobar" class="gary">
        <img src="/imgs/yay.png" />
    </a>
</body>
</html>';
$doc = new DOMDocument();
$doc->loadHTML($orig);
$anchors = $doc->getElementsByTagName('a');
foreach($anchors as $anchor)
{
    if($anchor->getAttribute('class') == 'watermark')
    {
        $anchor->setAttribute('class','fancybox');
        $img = $anchor->getElementsByTagName('img')->item(0);
        $currSrc = $img->getAttribute('src');
        $img->setAttribute('src',preg_replace('/(\.[^\.]+)$/','_new$1',$currSrc));
    }
}
$newStr = $doc->saveHTML();

Although for brain exercise, I've provided a regex solution as that was the original question, and sometimes DOM docs can be overkill amounts of code (though still preferable)

$newStr = preg_replace('#<a(.+?)class="watermark"(.+?)<img(.+?)src="(.+?)(\.[^.]+?)"(.*?>.*?</a>)#s','<a$1class="fancybox"$2<img$3src="$4_new$5"$6',$orig);

score 0 · Answer 2 · edited May 23 '17 at 11:50

Don't parse HTML with regex.

Find all links in html that have watermark class, change class to fancybox, and update first child image src.

$dom = new DOMDocument;
@$dom->loadHTML($html);
$xpath = new DOMXPath($dom);
foreach ($xpath->query('//a[contains(@class, "watermark")]') as $a) {
    $a->setAttribute('class', 'fancybox');

    $img = $xpath->query('descendant::img', $a)->item(0);
    # old value = $img->getAttribute('src');
    $img->setAttribute('src', 'new_value');
}
echo $dom->saveHTML();

How to using preg_replace class and src on img tag in php?

2 Answers2