for循环的问题求解释

Question

<script>
    var oUl=document.getElementsByTagName('ul')[0];
    var aLi=document.getElementsByTagName('li');
    var aDiv=document.getElementsByTagName('div');
    for(var i=0;i<aLi.length;i++){
        aLi[i].index=i;
        aLi[i].onclick=function(){
            for(var j=0;j<aLi.length;j++){
                aLi[j].className='';
                aDiv[j].className='';
            }
            this.className='ali';
            aDiv[this.index].className='show';
        }
    }
</script>

这样可以执行

<script>
    var oUl=document.getElementsByTagName('ul')[0];
    var aLi=document.getElementsByTagName('li');
    var aDiv=document.getElementsByTagName('div');
    for(var i=0;i<aLi.length;i++){
        aLi[i].index=i;
        aLi[i].onclick=function(){
                aLi[i].className='';
                aDiv[i].className='';
            this.className='ali';
            aDiv[this.index].className='show';
        }
    }
</script>

这样写就没有反应   为什么函数里要使用for循环  求解释 

Answer 1

<script>     var oUl=document.getElementsByTagName('ul')[0];     var aLi=document.getElementsByTagName('li');     var aDiv=document.getElementsByTagName('div'); //遍历所有的li     for(var i=0;i<aLi.length;i++){     //把li中的索引赋给当前li的索引，清除空格符所占的索引的位置         aLi[i].index=i;     //当前li的单击事件         aLi[i].onclick=function(){             //遍历所有的li             for(var j=0;j<aLi.length;j++){                 //清空所有li的类名                 aLi[j].className='';                 //清空所有div的类名                 aDiv[j].className='';             }             //当前li的类名=“ali”;             this.className='ali';             //当前li所对应的div的类名等于show             aDiv[this.index].className='show';         }     } </script>看完这段代码，现在知道你的第二段代码错哪里了吧

Answer 2

第一次使用for循环，是遍历所有的ali，并给ali添加onclick事件，第二次使用for循环，是onclick事件触发之后，重新遍历一次ali和odiv，以操作他们的className属性。如果第二次没有使用for循环的话，是取不到所有的ali和odiv的。

Answer 3

当触发点击事件时，aLi[i]是不是就等价于this呢？那么 aLi[i].onclick=function(){                aLi[i].className='';                aDiv[i].className='';            this.className='ali';            aDiv[this.index].className='show';        }此代码是否只是操作当前元素，没测试只是感觉是这样！

Answer 4

那是给没有被点击的写样式