JavaScript如何实现的简单Tab点击切换功能-创新互联
小编给大家分享一下JavaScript如何实现的简单Tab点击切换功能，相信大部分人都还不怎么了解，因此分享这篇文章给大家参考一下，希望大家阅读完这篇文章后大有收获，下面让我们一起去了解一下吧！
专注于为中小企业提供网站制作、
网站建设服务,电脑端+手机端+微信端的三站合一,更高效的管理,为中小企业
朝阳免费做网站提供优质的服务。我们立足成都，凝聚了一批互联网行业人才，有力地推动了上1000+企业的稳健成长，帮助中小企业通过网站建设实现规模扩充和转变。
具体如下：
www.jb51.net tab点击切换
*{
padding: 0;
margin: 0;
}
#example{
width: 500px;
height: 400px;
margin: 0 auto;
}
#example .hd ul li{
display: inline-block;
width: 32%;
height: 36px;
line-height: 36px;
border-radius: 5px;
background-color: #333;
text-align: center;
color: #fff;
}
#example .hd ul li.current{
background-color: green;
}
#example .bd{
border: 1px solid #ccc;
border-radius: 5px;
}
#example .bd ul li{
display: none;
}
#example .bd ul li.current{
display: block;
}
Beijing
- Shanghai
- Guangzhou
This is Beijing!
- This is Shanghai
- This is Guangzhou
