Question

I need to replace every instance of a an img tag that starts with http://player.vimeo.com with another url.

For example, you might find this in the code of the page:

<img src="http://player.vimeo.com/video/4887233">

I’m trying to make a jQuery script that will find every img src that begins with http://player.vimeo.com and replace the src with another string (it will be the same string for every vimeo link, essentially one variable).

How do I find the vimeo links and make sure the entire link is replaced no matter the length (some links will be longer than others but will always start with the same string)?

Answer 1

Select all the img with an attribute starts with selector:

$("img[src^='http://player.vimeo.com]'").each(function(){
    this.src = this.src.replace("player.vimeo.com", "new.url.com");
});

The above will replace player.vimeo.com in the src with new.url.com. If you need to set another src altogether, just do this.src = 'new url';.

It’s worth noting that when you want to change native attributes such as src, each will perform much better compared to attr, as can be seen in this jsPerf.

Check out demo on jsFiddle.