关于第10章编程挑战参考代码中的问题

来源:10-1 编程挑战

__呵呵哒_

2016-10-01 08:08

下面这段:

window.onload = function(){

             var oTab = document.getElementById("tabs");

             var oUl = oTab.getElementsByTagName("ul")[0];

             var oLis = oUl.getElementsByTagName("li");

             var oDivs= oTab.getElementsByTagName("div");

             for(var i= 0,len = oLis.length;i<len;i++){

                   oLis[i].index=i;

                 oLis[i].onclick = function() {

                     for(var n= 0;n<len;n++){

                         oLis[n].className = "";

                         oDivs[n].className = "hide";

                     }

                     this.className = "on";

                     oDivs[this.index].className = "";

                 }

             }

         }

最后部分:   this.className="on";

                     oDivs.[this.index].className="";

为什么不能把this.className换成oLis[i].className?难道不是一样的效果吗?(我已经测试过换了之后会出错)

同样的为什么不能把oDivs.[this.index]换成oDivs.[i].className呢?

写回答 关注

1回答

  • coneco
    2016-10-01 13:46:15
    已采纳

    我的理解是在oLis[i]的onclick方法在被调用时已经不在变量i的作用域中了。

    变量i位于window.onload中的for循环里,你说的那两个语句在for循环中被定义成函数绑定给了onclick,但这时onclick没有被调用。而在onclick在被调用时for循环所处的window.onload已经执行结束了。

    __呵呵哒_

    我又想了一下,差不多知道为什么不能这样了,貌似和你的思路差不多。因为在for循环执行完之后,i的值便不会变化了,此时i==2,在onclick调用之后这样的结果就变成一直都是显示oLis[2]和oDivs[2],感觉this真是功能强大啊!

    2016-10-01 18:10:25

    共 1 条回复 >

JavaScript进阶篇

本课程从如何插入JS代码开始,带您进入网页动态交互世界

468060 学习 · 21891 问题

查看课程

相似问题