标签:
<div id="show">
<div>1</div>
<div>2</div>
<div>3</div>
</div>
<div id="click">
<div>click1</div>
<div>click2</div>
<div>click3</div>
</div>
要求:1,点击click1,show对应显示1(2,3消失)
2,与此同时,click1的样式改变
3,点击其它click,显示类似
<script type="text/javascript"> window.onload = function() { var click_divs = document.getElementById("click") .getElementsByTagName("div"); var show_divs = document.getElementById("show") .getElementsByTagName("div"); for(var i = 0; i < click_divs.length; i++) { !function(a) { // 点击 #click div click_divs[a].onclick = function() { // #show div 全部隐藏 for(var x = 0; x < show_divs.length; x++) { show_divs[x].style.display = "none"; } // 对应 #show div 显示 show_divs[a].style.display = "block"; // #click div 样式还原 for(var y = 0; y < show_divs.length; y++) { click_divs[y].style.fontWeight = "Normal"; } // 对应 #click div 样式加粗 click_divs[a].style.fontWeight = "Bold"; }; }(i); } }; </script>
标签:
原文地址:http://www.cnblogs.com/OnlyCT/p/4454020.html