CODEWITHSUNDEEP
jquery
TSCAmerica.com
TSCAmerica.com

Reputation: 5377

Find image tag in my html page and replace with a domain name using Jquery

I have many images on my html page which looks like below...

<img src="/v/photos/80137-1.jpg" border=0 alt=""></a>
  <img src="myimage.jpg" border=0 alt=""></a>

so what i need to do is find all the < img tag in a page > and on body load replace it with 

<img src="http://www.abc.com/v/photos/80137-1.jpg" border=0 alt=""></a>
<img src="http://www.abc.com/myimage.jpg" border=0 alt=""></a>

So i am wondering if there is a way to do it using Jquery?

Upvotes: 1

Views: 263

Answers (1)

Nicola Peluchetti
Nicola Peluchetti

Reputation: 76880

you could do:

$(function() {
    $('img').each(function(){
       this.src = "http://www.abc.com/"+$(this).attr('src');
    });
});

EDIT - just to explain why i used this.src on the left and $(this).attr('src') on the right:

this.src is faster to access than it's jQuery counterpart, but on the right returns the full path to the image, so if i put this example in jsFiddle this.src returns http://jsfiddle.net/myimage.jpg while $(this).attr('src') returns only what's written in the src attribute: myimage.jpg.

Look at this fiddle if this is not clear: http://jsfiddle.net/6cHxR/9/

EDIT 2 - use the final / in the url you are adding (that means use http://www.abc.com/). In this way links will work both if their src begins with / and if it doesn't

Upvotes: 3

Related Questions