window.onload = function() {
var oUl1 = document.getElementById("ul1");
var aLi = oUl1.getElementsByTagName("li");
var oDiv = document.getElementById("tab-list");
var aDiv = oDiv.getElementsByTagName("div");
for(var i = 0; i < aLi.length; i++) {
aLi[i].index= i;
aLi[i].onmouseover = function() {
for(var i = 0; i < aLi.length; i++) {
aLi[i].className = "";
}
this.className = "active";
for(var j = 0; j < aDiv.length; j++) {
aDiv[j].className = "hide";
}
aDiv[this.index].className = "show";
}
}
}
1、aLi[i].index = i 2、aLi[i].className = "" 3、 this.className = "active"; 4、 aDiv[this.index].className = "show"; ,特别是第三条的this指的是什么
1.通过遍历,给相应的元素设置索引值。2.将索引值为i的li标签的类名设置为空,也就是暂时删除hide类名3.this就是指当前高亮的元素4.让当前的div元素显示
可以这么理解,aDiv[this.index]获取的是相应索引值下的div元素
这个是给当前元素添加了一个active的类,并显示这个类所包含的样式
索引值是该元素的一个属性,你这样的写法是将i的值赋给了这个元素,逻辑上有错误。
this是指当前的元素,比如说你点击了第二个li标签,那么this就指代第二个li标签