Question

我正在研究这个用于炒作网络动画的小功能。基本上，我有2到8个左右的菜单项，当点击一个菜单项时，它必须变得稍微不透明，前一个必须再次变得不透明。我有一个变量设置为最近点击的元素id，另一个变量设置为菜单项使用getElementIdByClassName的元素类。 for循环迭代类中的id，if / else表示＆＃34;如果colors [i] .id！= currentColor将opacity设置为1;否则将不透明度设置为.3＆＃34;，或者至少我认为它是这样说的。任何人都可以帮忙吗？我似乎无法弄明白。

谢谢！

  changeShoe(hypeDocument, element, event){ 
        var currentColor = element.id;
        var colors = document.getElementsByClassName("colors").id;

         for (i = 0, n = colors.length; i<n; i++) {
                if(colors[i] !== currentColor){
                    colors[i].style.opacity = 1;
                    }
                else{
                    colors[i].style.opacity = .3;
                    }

            }

    }

Answer 1

您的代码有什么问题以及如何修复。

changeShoe(hypeDocument, element/*, event*/){ //event is not used and can be removed from parameters
    var currentColor = element.id;//This is good
    //var colors = document.getElementsByClassName("colors").id;
    //document.getElementsByClassName("colors") is a HTMLCollection and doesn't have **id** property
    //it means colors is undefined
    var colors = document.getElementsByClassName("colors");// this way

     for (i = 0, n = colors.length; i<n; i++) {//good approach
            //colors is now collection and colors[i] is HTML element. So .id
            //if(colors[i].id !== currentColor){//this is OK IIF each element has unique ID
            if(colors[i] !== element){//not exact match
                colors[i].style.opacity = 1;//now it is correct
                }
            else{
                colors[i].style.opacity = .3;
                }
        }
}

Answer 2

document.getElementsByClassName("colors").id;

没有给你一个数组。

试

changeShoe(hypeDocument, element, event){ 
    var currentColor = element.id;
    var colors = document.getElementsByClassName("colors");

     for (i = 0, n = colors.length; i<n; i++) {
            if(colors[i].id !== currentColor){
                colors[i].style.opacity = 1;
                }
            else{
                colors[i].style.opacity = .3;
                }
        }
}

javascript for循环，嵌套的if / else语句没有执行，不知道出了什么问题

2 个答案: