Javascript image url replacement

Question

I want to write a greasemonkey script/chrome user script that takes any images with a certain syntax and replace a section of the url and puts it back in the dom.

Namely I have a page full of thumbnails, e.g. www.example.com/small/randomstuff and I want to replace the imades with the equivilant www.example.com/large/randomstuff

How would I do this?

Itay Moav -Malimovka · Accepted Answer · 2009-12-20 19:47:42Z

6

After page was loaded.

var imgs = document.getElementsByTagName('img');
var len =imgs.length;
for(var i=0;i<len;i++){
  imgs[i].src=imgs[i].src.replace("small","large");
}

answered Dec 20, 2009 at 19:47

Itay Moav -Malimovka

53.8k68 gold badges198 silver badges292 bronze badges

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

6 Comments

Jason Over a year ago

actually, this is the more correct answer, as the OP wants all thumbnails replaced

Atli Over a year ago

You can use the alternative for syntax, and avoid having to create the len variable, by doing for(var i in imgs).

Itay Moav -Malimovka Over a year ago

@Atli Assuming you will use in the future some kind of library (like JQ or Mootools) this will make your code less portable, as those libraries add properties to the Array object.

Jeff Rupert Over a year ago

@Atli: I've always read that you should avoid the for( x in y ) loop in JavaScript because it's quite inefficient. Maybe not a big deal here, but... yeah.

bobince Over a year ago

You definitely don't want for...in here. Quite apart from the prototype-extension issue with libraries, it will give you other non-numeric properties of NodeList, like item, namedItem and length. Don't use for...in against Array or other sequences, it is always the wrong thing. Incidentally you can use document.images as an old-school short-cut for the getElementsByTagName call.

|

jbochi · Accepted Answer · 2009-12-20 19:46:35Z

2

To replace a image source url, you can do something like this:

var imgs = document.getElementsByTagName('img')
imgs[0].src = "http://www.example.com/large/randomstuff"

edited Dec 20, 2009 at 19:46

answered Dec 20, 2009 at 19:43

jbochi

29.7k16 gold badges77 silver badges90 bronze badges

1 Comment

Tom J Nowell Over a year ago

I gave you an upvote as it does the meat of the work, but Itay Moavs answer does everything

Collectives™ on Stack Overflow

Javascript image url replacement

2 Answers 2

6 Comments

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

6 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related