为了账号安全,请及时绑定邮箱和手机立即绑定

应该怎么理解lis[i].index=i比价好,囧我理解是为了传给 onclick中的divs中的i

 window.onload=function(){
        var tabs=document.getElementById("tabs");
        var divs=tabs.getElementsByTagName("div");
        //tabs.get。。。是为了获取id为tabs下的所有标签div的节点
        var lis=document.getElementsByTagName("li");
        for(var i=0;i<lis.length;i++){
            lis[i].index=i;
            lis[i].onclick=function(){
                for(var n=0;n<lis.length;n++){//先给所有的选项的li都取消on,div都隐藏
                    lis[n].className = "";
                    divs[n].className = "hide";
                }//再给点击的那个选项li设置on,div显示
                this.className = "on";
                divs[this.index].className = "";
            }

        }

    }

如果直接用divs[i]的话是浏览器是无法识别的,所以先用lis[i].index=i,把i传递过去,再在divs[this.index]中。不知道我这样理解对不对,有没有更好的解释

正在回答

5 回答

通过for循环遍历给lis的每个子元素添加点击事件,当某个li触发事件我们希望通过下标定位到对应的div并对其操作,但是在这之前,i会被系统回收(垃圾回收机制)。我们可以吧每个li看做一个对象,自定义一个index属性(可以随便取名字a,b,随便啦)通过for循环,给lis的每个子元素(li)的index属性赋予期下标值,当li触发事件,this指向了当前触发事件的li,通过他的index属性取到它的下标值,这样div[this.index]就是当前li对应的div了(实现了点击li与对应的div能做出响应)

0 回复 有任何疑惑可以回复我~
#1

刘毅毅

请问这种回收出现在什么时候呢?for下面的控制语句和函数都会吗?
2016-11-13 回复 有任何疑惑可以回复我~

用divs[i]来代替divs[this.index]无法实现效果,不是因为divs[i]无法识别,而是i不固定,i是从0~lis.length-1,如果直接用divs[i]来做的话那无论点哪个标题都会显示最后一个的内容,因为会循环到最后,divs[lis.length-1].className=""; 而让lis[i].index=i,这样每个li都有自己的编号,在lis[i].onclick=function()中,this就是当前点击的li,根据当前点击的li的index,可以确定展现哪个div

4 回复 有任何疑惑可以回复我~
#1

刘毅毅

请问为什么会循环到最后?不是onclick才触发函数么
2016-11-13 回复 有任何疑惑可以回复我~
#2

NadiaSmile 回复 刘毅毅

但是onclick是在外层for循环里面,外层的循环会一直走到最大的一个i,所以如果有4个li,回事i=3 无论点那个li,都是展示最后一个div
2016-11-14 回复 有任何疑惑可以回复我~
#3

刘毅毅 回复 NadiaSmile

哦对。几个大括号没弄清
2016-11-15 回复 有任何疑惑可以回复我~

二楼正解,我原来是做iOS的,一开始看也不明白,只知道把这行注了就没效果了,后来才知道只是为了给该属性绑定值,lis[i]有index的属性,但是这个属性没有值。需要让lis[i].index=i;其实这里把index改成id也可以。只是为了给lis[i]一个值,lis[i]有值之后才可以确定点的是哪个li

还有不理解的尽情追问,如果明白了请采纳我的答案哦  谢谢~~

1 回复 有任何疑惑可以回复我~

就是为了保存i的值

0 回复 有任何疑惑可以回复我~

不知道....

0 回复 有任何疑惑可以回复我~

举报

0/150
提交
取消

应该怎么理解lis[i].index=i比价好,囧我理解是为了传给 onclick中的divs中的i

我要回答 关注问题
意见反馈 帮助中心 APP下载
官方微信