替换页面加载时的所有img src-Javascript

Question

当它们中有特定的URL时，我尝试替换页面上的所有img src。 到目前为止，我已经能够记录所有替换后的img src，但是我的最后一步是在页面上进行更改。

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;

看我的笔： https : //codepen.io/kleefaan/pen/yqzBVv

Answer 1

您可以像下面这样在for循环中执行replace，而不是将所有元素都放入数组中：

// 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);
}