JavaScript实现简单的标签选项卡切换

本文实例讲解了Java脚本语言实现简单的标签选项卡切换的示例代码，分享给大家供大家参考，具体内容如下

效果图：

具体代码：

！DOCTYPE html html lang=' en ' head meta charset=' UTF-8 '标题表切换/title style type=' text/CSS ' * { padd : } button { width : 95px；} .活动{背景-颜色：黄色；} # wrap { width:510px飞越：隐藏；margin:0 auto} #内部{ width:9999px飞越：隐藏；相对位置：左转：0凌日：左0.6s} #内部a {左侧浮动：} #内部img {显示：块；宽度width :510 px } # main { text-align : center；}/style/head body div id=' wrap ' div id=' inner ' a href=' # ' img src=' http : img/1。jpg '/a href=' # ' img src=' http : img/2。jpg '/a href=' # # img src=' # # # ' img src=' http 3360 img/3。jpg '/a href=' # ' img src=' http 33333获取节点var BTN列表=文档。getelementsbytagname(' button ')；var inner=文档。getelementbyid(' inner ')；//可见宽度var perWidth=inner.children[0].offset with//添加事件for(var I=0；i btnList.lengthi ) { btnList[i].索引=我；btnList[i].onclick=function(){ inner。风格。left=-PEr width * this。索引“px”；for(var j=0；j btnList.lengthj ) { btnList[j].CLaSS name=} this . CLaSS name=' active } }/脚本/正文/html希望本文所述对大家学习爪哇岛描述语言程序设计有所帮助，熟练掌握选项卡切换操作。