做网页时经常有用到选项卡，网上找的代码有很多都很复杂，用JQ感觉也很麻烦，平时涉及到的选项卡相对较少，所以收集到一个以循环方式显示隐藏层的javascript片段：
<style type=”text/css”>
.div{width:100px;height:50px;border:1px solid #999999;text-align:center;}
.div span{line-height:50px;}
#d1{display:block;}
#d2,#d3{display:none;}
</style>
<script type=”text/javascript”>
function change(num){
for(i=1;i<=3;i++){
document.getElementByIdx_x(“d”+i).style.display=”none”;
}
document.getElementByIdx_x(“d”+num).style.display=”block”;
}
</script>
</head>
<body>
<a href=”#” onclick=”change(1)”>模块A</a>
<a href=”#” onclick=”change(2)”>模块B</a>
<a href=”#” onclick=”change(3)”>模块C</a>
<div id=”d1″><span>1</span></div>
<div id=”d2″><span>2</span></div>
<div id=”d3″><span>3</span></div>
</body>
如果一个页面中有多个地方要做这效果，可能有点麻烦，JS还在学习阶段，笨点的方法，添加执行函数；感觉有点重复……
转载请注明带链来源：春语精椿
