JQ代码
<script type="text/javascript">
$(document).ready(function () {
//遍历tabmenu里面 li
$("#tou li").each(function (e) {
//当前点击的li
$(this).click(function () {
//删除全部样式
$("#tou li").removeClass("tab");
//为当前添加样式
$(this).addClass("tab");
//显示对应的div
$("#wei div").eq(e).show().siblings().hide();
});
});
});
</script>
<body>
<div id="zuida">
<div id="tou" >
<ul>
<li class="tab">新闻</li>
<li>体育</li>
<li>游戏</li>
</ul>
</div>
<div id="wei">
<div class="con">新闻</div>
<div>体育</div>
<div>游戏</div>
</div>
</div>
</body>
效果