求javascript/如何控制多个div层显示与隐藏,万分感谢

想做如下效果出来:
<div id="center">
<div id="left">
<ul>
<li><a href="#">链接一</a></li>
<li><a href="#">链接二</a></li>
<li><a href="#">链接三</a></li>
<li><a href="#">链接四</a></li>

</ul>
</div>
<div id="right">
<div class="a"></div>
<div class="b"></div>
<div class="c"></div>
<div class="d"></div>
</div>
</div>
我想点击左边的链接一显示右边的.a容器内容,其它隐藏。
点击二显示b容器的内容,其它隐藏,注意,这只是随便写点代码,假如左边有十个,或更多的超链接时,用javascript哪种方法更方便?本人刚入门,请各位大哥路过帮手。谢谢!!!!
帮忙附个简单的代码

第1个回答  推荐于2016-09-05
<script>
function showContent(num)
{
for(var i=0;i<right.children.length;i++)
{
right.children(i).style.display="none";
}
right.children(num).style.display="";
}
</script>
<div id="center">
<div id="left">
<ul>
<li><a href="#" onclick="showContent(0)">链接一</a></li>
<li><a href="#" onclick="showContent(1)">链接二</a></li>
<li><a href="#" onclick="showContent(2)">链接三</a></li>
<li><a href="#" onclick="showContent(3)">链接四</a></li>

</ul>
</div>
<div id="right" style="width:200;height:100;background-color:#abcdef">
<div class="a" style="display:none">一的内容</div>
<div class="b" style="display:none">二的内容</div>
<div class="c" style="display:none">三的内容</div>
<div class="d" style="display:none">四的内容</div>
</div>
</div>本回答被提问者采纳
第2个回答  2009-09-13
你给div去一样的名字

用var divs=getElementByNames()获取

遍历divs,把他们都隐藏,你要显示的div除外(用if判断下)
相似回答