keiu 的 jQuery 代码为正解。下面是用原生 JavaScript 实现,相对复杂一些。
<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>