本文实例讲述了js实现点击切换TAB标签。分享给大家供大家参考。具体如下：
这里演示的选项卡效果代码，无jq,纯JS来实现，灰色风格，没有怎么美化，或许看上去比较普通，不过兼容性和操作起来挺舒服的，风格适用于大部分的网站，或许你会用得上。
先来看看运行效果截图：
在线演示地址如下：
http://demo.jb51.net/js/2015/js-tab-click-cha-menu-codes/
具体代码如下：
点击切换选项卡代码 *{margin:0;padding:0;list-style-type:none;} a,img{border:0;} body{font:12px/180% Arial, Helvetica, sans-serif, "新宋体";} .tab1{width:401px;border-top:#cccccc solid 1px;border-bottom:#cccccc solid 1px;margin:50px auto 0 auto;} .menu{height:28px;border-right:#cccccc solid 1px;} .menu li{float:left;width:99px;text-align:center;line-height:28px;height:28px;cursor:pointer;border-left:#cccccc solid 1px;color:#666;font-size:14px;overflow:hidden;background:#E0E2EB;} .menu li.off{background:#FFFFFF;color:#336699;font-weight:bold;} .menudiv{height:200px;border-left:#cccccc solid 1px;border-right:#cccccc solid 1px;border-top:0;background:#fefefe} .menudiv div{padding:15px;line-height:28px;} 我的网站 JS代码,导航菜单 看到效果了吗？？？ 我的网站我做主
- 首页
- 点击看看
- 会自动的
- 我的网站
希望本文所述对大家的javascript程序设计有所帮助。
