Question

我正在尝试获得多个元素，这些元素在3个数组“tops”，“bottom”，“shoes”下组织。

我知道我可以使用

抓取多个对象

document.getElementsByClassName("class1 class2");

如何更改每个对象的样式，我当前的代码是:(我已经尝试过可见性和不透明度，但它仍然会收到未捕获的类型错误，因为document.getelements ....没有返回任何东西。

function filter() {
var this_id = event.target.id;
console.log(this_id);
if (this_id = "filtertops") {
    document.getElementsByClassName("a4 a7 a11 a12 a8").style.visibility="hidden"; //not tops
    document.getElementsByClassName("a1 a2 a3 a5 a9 a10 a14").style.visbility="visible"; // tops
    }
else if (this_id = "filterbottoms") {
    document.getElementsByClassName("a2 a3 a5 a10 a14 a8").style.opacity="0.4"; //not bottoms
    document.getElementsByClassName("a1 a4 a7 a9 a11 a12").style.opacity="1"; //bottoms
    }
else if (this_id = "filtershoes") {
    document.getElementsByClassName("a1 a2 a3 a4 a5 a7 a9 a10 a11 a12 14").style.opacity="0.4"; //not shoes
    document.getElementsByClassName("a8").style.opacity="1"; //shoes
    }

我尝试将它们分配给变量，然后使用for循环来更改每个对象的样式，但这也没有用。

function filterbottoms() {
    var nonbottom = document.getElementsByClassName("a2 a3 a5 a10 a14 a8");
    var bottoms = document.getElementsByClassName("a1 a4 a7 a9 a11 a12");
    for (i in bottoms)
        {
            i.style.visibility='visible';
        }
    for (i in nonbottom)
        {
            i.style.visibility='hidden';
        } 

}

Answer 1

你接近for循环：

for (i in bottoms){
    bottoms[i].style.visibility='visible';
}

应该{{1}}但不会<edit>有效。在每次迭代时，</edit>是下一个键，而不是下一个值。

但是你应该使用传统的i而不是for：

for..in

编辑：我推荐使用传统的

for (var i = 0; i < bottoms.length; i++){
    bottoms[i].style.visibility='visible';
}

循环，因为使用for通常不适合数组或类似数组的对象（取决于特定对象），它将迭代非数字属性。约瑟夫的评论证实，在这种情况下，for..in肯定不会因此而起作用。

使用javascript更改多个图像的样式（不透明度）

1 个答案: