1 //导航栏单击变换内容 2 function tabSwitch(_this,num) { 3 var tag = document.getElementById("nav9"); 4 var number = tag.getElementsByTagName("a").length; //获取导航栏元素个数 5 var divNum = document.getElementsByClassName("eachDiv").length; //获取导航元素对应的div个数 6 //console.log(divNum); 7 for(var i=0;i<number;i++){ 8 //console.log(number[i].className); 9 if(i==num-1) { 10 _this.className = "l_nav1_no1"; //给当前导航栏元素添加样式 11 var content = document.getElementById("l_no2_"+num); //当前导航栏元素对应的div 12 //console.log(content); 13 content.style.display = "block"; //显示当前导航栏元素对应的div部分 14 } 15 else { 16 number[i].className = ""; //清除所有导航栏元素的特殊样式 17 divNum[i].style.display = "none"; //所有div都隐藏 18 } 19 } 20 }
基本效果如图:
在运行时点击上面导航栏的a标签,下面的div区域内容没有任何变化,不知道问题在哪~麻烦各位大神帮帮忙!
该部分HTML为: