加载程序后的 Javascript 图像

Question

所以我正在编写一个 javascript 来替换默认图像，该默认图像填充了我网页上大量图像的空间。这样，页面加载速度就会快得多。 (脚本是通过主体加载启动的)所有默认图像都具有相同的类，并且它们的 ID 等于它们的文件名。

function imgPostLoad(totalpics, placeholder) {
    var img = document.createElement('img');
    for (var i = 0; i < totalpics; i++) {
        var picture = document.getElementsByClassName(placeholder)[i];
        img.onload = function (evt) {
            picture.src = this.src;
            picture.width = this.width;
            picture.height = this.height;
        }
        img.src = "/img/" + picture.getAttribute("id") + ".jpg";
    }
}

它有效，但仅适用于数组中的最后一张图像。其余图像保持不变。有什么问题吗？

Answer 1

你可以简单地做:

function imgPostLoad(totalpics, placeholder) {
    for (var i = 0; i < totalpics; i++) {
        var picture = document.getElementsByClassName(placeholder)[i];
        picture.src = "/img/" + picture.getAttribute("id") + ".jpg";
    }
}

您的代码中的问题是，在加载 img 时，picture 是另一个变量。