Replace all img src on page load - Javascript

Question

I'm trying to replace all img src's on my page, when they have a certain url in them. So far I'm able to log all the replaced img src's, but my final step would be to change them on my page.

function replaceMyImgs() {

// put live url here
var liveUrl = "via.placeholder.com";

// find the local url
var localUrl = "testdomain.com";

// replace the local url for the live url
var newUrl = localUrl.replace(/testdomain.com/g, liveUrl);

// console.log(newUrl);

// get all images and push them in an empty array
var imgs = document.getElementsByTagName("img");
var imgSrcs = [];

for (var i = 0; i < imgs.length; i++) {
  imgSrcs.push(imgs[i].src);
}

imgSrcs.forEach(function(src) {
   // log all the found img srcs
   var newSrc = src.replace(/testdomain.com/g, liveUrl);

   imgs.src = newSrc;

   console.log(imgs.src);

 });

}

window.onload = replaceMyImgs;

See my pen: https://codepen.io/kleefaan/pen/yqzBVv

You should iterate through imgs and for each of them use setAttribute("src",newSrc). — Przemek Marcinkiewicz, Jul 27 '18 at 07:19
Possible duplicate of [Change all tag src attributes in html document?](https://stackoverflow.com/questions/39988839/change-all-img-tag-src-attributes-in-html-document) — Vikasdeep Singh, Jul 27 '18 at 07:22
@Brad , logging the new src's do work indeed. Does it need another action to actually change the images in the browser? — S. Wannsee, Jul 27 '18 at 07:23

score 1 · Accepted Answer · answered Jul 27 '18 at 07:29

1

Instead of pushing all elements into an array you can do the replace in the for loop like this:

// get all images
var imgs = document.getElementsByTagName("img");

for (var i = 0; i < imgs.length; i++) {
  var newSrc = imgs[i].src.replace(/testdomain.com/g, liveUrl);
  imgs[i].src = newSrc;
  console.log(imgs[i].src);
}

answered Jul 27 '18 at 07:29

Martin

2,411
11
28
30

This was exactly what I was looking for! Thank you. – S. Wannsee Jul 28 '18 at 07:54

Replace all img src on page load - Javascript

1 Answers1