Question

我正在尝试使用weserv.nl图像代理服务来使用他们的云服务器加载图像，并且不会厌恶原始的img src图像。为所有图像重写src是为时已晚，我也不想为此使用jQuery，因为我的目的是使网站更快，而不是加载速度慢。所以我想要的是img src不加载原始图像，而是在src中添加前缀并加载结果。小提琴的例子是here。困难的部分是图像没有分配id或类。

var items = document.querySelectorAll("div.separator img");
for (var i = items.length; i--;) {
    var img = items[i];
    img.src = img.src.replace(/.*?:\/\//g, "");
    img.src='https://images.weserv.nl?url='+img.src+'&w=120';
}

Answer 1

由于图像没有附加类或ID，您仍然可以引用父标记并获取要替换的所有图像。

同样在您的代码中，您要设置两次src属性。这不是必需的。当您替换//时，只需将其存储到变量中，稍后将其设置为img.src

根据你的小提琴，你有两个div，所以我使用div img作为选择器来改变src

var items = document.querySelectorAll("div img");
for (var i = items.length; i--;) {
    var img = items[i],
        src = img.src.replace(/.*?:\/\//g, "");
    img.src='https://images.weserv.nl?url='+src+'&w=120';
}

<强> DEMO

使用querySelectorAll为图像源添加前缀

1 个答案: