Regex to change <img> relative URLs to absolute

Question

I need to look inside a string of HTML and change all <img> tags where the src attribute is a relative address, to an absolute URL. So this:

<img src="puppies.jpg">

needs to become:

<img src="http://sitename.com/path/puppies.jpg">

while ignoring <img> tags whose src attribute is already absolute.

I'm using PHP and assume that I'll need to run this through preg_replace(). Help! And Thanks!

possible duplicate of Javascript: REGEX to change all relative Urls to Absolute — Madara's Ghost
– Madara's Ghost, Commented Apr 30, 2012 at 19:08
Consider using DomDocument class instead of preg for doing HTML stuff. — Ja͢ck
– Ja͢ck, Commented Apr 30, 2012 at 19:09

gen_Eric · Accepted Answer · 2012-04-30 19:15:55Z

8

This is not a job for a regular expression. It's a job for an XML/DOM parser.

I'd give DOMDocument a shot.

$DOM = new DOMDocument;
$DOM->loadHTML($html);

$imgs = $DOM->getElementsByTagName('img');
foreach($imgs as $img){
    $src = $img->getAttribute('src');
    if(strpos($src, 'http://sitename.com/path/') !== 0){
        $img->setAttribute('src', "http://sitename.com/path/$src");
    }
}

$html = $DOM->saveHTML();

edited Apr 30, 2012 at 19:15

answered Apr 30, 2012 at 19:10

gen_Eric

228k42 gold badges304 silver badges343 bronze badges

Sign up to request clarification or add additional context in comments.

4 Comments

Evan Davis Over a year ago

I upvoted, but it also needs a check for src attributes which are already absolute, per the OP.

gen_Eric Over a year ago

@Mathletics: Ah yes, didn't notice that, I can add that :-P

gen_Eric Over a year ago

@Jack: Good idea, changed :-P

Sam Over a year ago

Yay! That does it! Question: the HTML that gets returned automatically gets a <doctype>, <html>, <body>, etc... tags. Is there any way to turn that off? All I want is what I gave it to start... just with the find-and-replace part done. Does that make sense?

sbstjn · Accepted Answer · 2012-05-01 00:41:58Z

0

This is not a job for a regular expression. It's a job for an XML/DOM parser.

Nope it's not. If you just want to add a prefix to each src attribute, it's best to use simple string functions and don't even think about xml, regex or dom parsing…

$str = str_replace('<img src="', '<img src="http://prefix', $str);

You can clean up wrong links (already absolute ones) afterwards

$str = str_replace('<img src="http://prefixhttp://', '<img src="http://', $str);

Do not blow up your code with regexp/dom if you can avoid it.

edited May 1, 2012 at 0:41

answered Apr 30, 2012 at 19:13

sbstjn

2,2241 gold badge16 silver badges13 bronze badges

4 Comments

gen_Eric Over a year ago

What would happen happen if my HTML was <img class='animals' src='puppies.jpg' />?

sbstjn Over a year ago

@Rocket sorry, but he said his HTML is <img src="puppies.jpg">

sbstjn Over a year ago

wrong links can easily be fixed: str_replace('prefixprefix', 'prefix', $str) str_replace('http://prefix/http://', 'http://', $str) don't blow up your code with regex/dom if you do not have to…

Sam Over a year ago

@semu, I'm totally with you on this one. For this instance (and mine) there's no reason to add all kinds of unnecessary overhead when a simple solution exist... albeit not the most graceful, it definitely gets the job done.

Collectives™ on Stack Overflow

Regex to change <img> relative URLs to absolute

2 Answers 2

4 Comments

4 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

4 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related