2回答

• 

  码美

  2018-07-06 12:56:08

  这样写的错误在哪里呢，首先页面加载的时候，会把你这段js代码撸了一边，关键点在执行到了for循环里面，到底是安什么逻辑执行的，回到页面上看看，发现3个li元素鼠标移上去，样式都变成可点击的样式了，说明这段代码li[i].onclick=function(){func1}起了作用，但是在没有点击的情况下，func1是不会执行的，点击li元素的时候，才执行func1，再看看执行func1的逻辑：for 循环，里面一个if...else...判断，if的判断条件是i==n，这个时候的i是多少很关键，在最外面的for循环在页面加载的时候就已经执行完毕了，循环第一遍的时候i=0;i<3;i++，执行for循环里面的代码，第二遍i=1;i<3;i++，还是执行里面的代码，第三边i=2;i<3;i++，继续执行里面的代码，第四边i=3，这个时候i不小于3了,然后条件看不成立，就不再执行这个for循环了，所以，里面的for循环永远只会执行else部分（因为i=3）你可以测试下在点击的时候alert(i)，li[i].onclick=function(){func1；alert(i);}
  

  所以才会出现提示答案里的oLis[i].index = i这样一句代码，页面加载的时候外面的for循环就实时给每个li元素自定义了一个index属性，并赋值i（也就是分别为0，1，2）。

  还有一个解决方法我也说不太明白（我也是初学者），如果要用这个方法你要去了解一下闭包和立即执行函数，还有js的内存机制。具体写法如下：

  <script type="text/javascript">

      // JS实现选项卡切换

      var tab=document.getElementById("tab-list");

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

      var li=ul.getElementsByTagName("li");

      var content=tab.getElementsByTagName("div");

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

      (function(j){

      li[i].onclick=function()

           {

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

               {

                   if(j==n)

                   {

                       li[n].className = "now";

                       content[n].className = "";

                   }

                   else

                   {

                       li[n].className = " ";

                       content[n].className = "hide";

                   }

               }

           }

      })(i)

      }

  
  

      </script>

  
  

  0 0
• 

  我和我的小狐狸

  2018-05-23 19:44:05

  if判断哪把n改成this，因为我要指向到当前

  0 0