                        课程
                    
                        /前端开发
                        
                            /JavaScript
                        
                        /JavaScript进阶篇

哪位大神可以帮我解说以下代码？

window.onload=function(){

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

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

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

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

li[i].index=i;

li[i].onclick=function(){

for(var n=0;n<li.length;n++){

li[n].className="";

div[n].className="hide";

}

this.className="on";

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

}

慕粉3597558

2016-08-05

源自：JavaScript进阶篇 10-1

关注问题我要回答

560

操作

收起

1 回答

Joker208 回答被采纳 +3 积分
2016-08-05

语言组织比较差，有问题可以回复我

 window.onload=function(){
		//将id=tabs的节点赋值给"oTab"
        var oTab=document.getElementById("tabs");
		//将所有li节点赋值给"li"这个数组
        var li=document.getElementsByTagName("li");
		//将oTab下的所有div节点赋值给"div"这个数组
        var div=oTab.getElementsByTagName("div");
		//遍历所有的li节点
        for(var i=0;i<li.length;i++){
			//给每一个li设置索引值
            li[i].index=i;
			//给每一个li添加单击事件
            li[i].onclick=function(){
				//遍历oTab下的所有div节点
                for(var n=0;n<li.length;n++){
					//给每一个li的class属性设置为""
                    li[n].className="";
					//给每一个div的class属性设置为"hide"
                    div[n].className="hide";
                }
				//给当前li的class属性设置为"on"
                this.className="on";
				//给当前li的索引值对应的div的class属性设置为""
                div[this.index].className="";
            }
        }