微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

基于javascript实现tab选项卡切换特效调试笔记

本文实例为大家分析了javascript实现tab选项卡切换的调试笔记,供大家参考,具体内容如下

制作导航栏,点击导航栏元素时下面的内容会产生相应的变化,并且该元素显示特殊样式。

js源代码

rush:js;"> //导航栏单击变换内容 function tabSwitch(_this,num) { var tag = document.getElementById("nav9"); var number = tag.getElementsByTagName("a"); //获取导航栏元素个数(getElementsByTagName是返回元素素组) var divNum = document.getElementsByClassName("eachdiv"); //获取导航元素对应的div个数 for(var i=0;i一个数组,这里应该用number.length显示它的长度5 number[i].className = " "; //清除所有导航栏元素的特殊样式 divNum[i].style.display = "none"; //其他所有div都隐藏 } _this.className = "l_nav1_no1"; //给当前导航栏元素添加样式 var content = document.getElementById("l_no2_"+num); //当前导航栏元素对应的div content.style.display = "block"; //显示当前导航栏元素对应的div部分 }

HTML代码

rush:xhtml;"> Meta charset="UTF-8">

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐