Question

所以我编写了这个javascript来将特定类的所有div中所有图像的图像大小加倍。这就是我想出来的。

var lmnts = document.getElementsByTagName('*'), i;
for (i in lmnts) {
    if((' ' + lmnts[i].className + ' ').indexOf(' ' + 'ClassName' + ' ') > -1) {
        var images = document.lmnts[i].getElementsByTagName('img');
        for(var j=0; j<images.length; j++)
        {
            images[j].height *= 2;
            images[j].width *= 2;
        }
    }
}

然而，我无法让它发挥作用：（

编辑：这是一个用户脚本。所以它不起作用，它没有做它应该做的事情。 js控制台中没有错误。

在调试时，我发现它只进入第一个循环，然后在该行之后失败 var images = document.lmnts[i].getElementsByTagName('img');

EDIT2：这是一个用户手册，可以将4chan.org板上fileThumb类所有图像的图像尺寸加倍。

Answer 1

主要问题是var images = document.lmnts[i].getElementsByTagName('img');行。

lmnts是变量而不是document的属性。

应该阅读var images = lmnts[i].getElementsByTagName('img');

此外，不是手动循环DOM中的所有元素，而是手动测试className是否包含您想要的类，您可以使用document.getElementsByClassName('ClassName')或更现代的document.querySelectorAll('.ClassName')。使用第二种方法，您还可以使用document.querySelectorAll('.ClassName img')一次性选择所有图像。

所以你的所有代码都可以简化为

var images = document.querySelectorAll('.ClassName img');
for (var j = 0; j < images.length; j++){
    images[j].height *= 2;
    images[j].width *= 2;
}

更新（基于评论）

4chan上的图片应用style属性设置维度，而images[j].height设置图片的属性height。不幸的是，style属性取得了优势，并显示从脚本设置的值不起作用。

您应该像这样更改style属性

var images = document.querySelectorAll('.fileThumb img');
for (var j = 0; j < images.length; j++){
    var image = images[j],
        initialWidth = parseInt(image.style.width, 10),
        initialHeight = parseInt(image.style.height, 10);

    image.style.width = (initialWidth * 2) + 'px';
    image.style.height= (initialHeight * 2) + 'px';
}

Javascript将特定类的所有div中的所有图像的大小加倍

1 个答案: