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

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

来源：10-1 编程挑战

大块吃肉188

2016-08-30 10:01

 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回答

qq_请不要放弃治疗_03628983

2016-09-01 20:59:52

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

1 0

刘毅毅

请问这种回收出现在什么时候呢？for下面的控制语句和函数都会吗？

2016-11-13 02:41:08

共 1 条回复 >
NadiaSmile

2016-08-30 12:05:24

用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

3 4

刘毅毅回复NadiaS...

哦对。几个大括号没弄清

2016-11-15 13:46:35

共 3 条回复 >
NadiaSmile

2016-08-30 11:39:10

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

0 1
ZevveZ

2016-08-30 10:26:07

就是为了保存i的值

0 0
心的世界

2016-08-30 10:19:05

不知道....

0 0