本文介绍了一个简单的HTML页面示例，通过JavaScript实现点击不同表格单元格时，切换显示相应的内容区块。此示例展示了如何使用JavaScript操作DOM元素的显示状态。
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>无标题文档</title>
</head>
<body>
<table >
<tr>
<td id="td1" onclick="doClick(this)">1</td>
<td id="td2" onclick="doClick(this)">2</td>
</tr>
</table>
<table id="t1" style="display:none">
<tr>
<td>
1111111111111
</td>
</tr>
</table>
<table id="t2" style="display:none">
<tr>
<td>
22222222222222
</td>
</tr>
</table>
<hr />
<hr />
<table>
<tr>
<td id="td3" onclick="dothis(this)">3</td>
</tr>
</table>
<table id="t3" style="display:none">
<td>
<tr>
3333333333333
</tr>
<tr>
4444444444444
</tr>
<tr>
5555555555555
</tr>
<tr>
6666666666666
</tr>
</td>
</table>
</body>
</html>
<script type="text/javascript">
<!--
function doClick(o){
var j;
var id;
var e;
for(var i=1;i<=2;i++){
id ="td"+i;
j = document.getElementById(id);
e = document.getElementById("t"+i);
if(id != o.id){;
e.style.display = "none";
}else{
e.style.display = "block";
}
}
}
function dothis(o){
var i=document.getElementById("t3");
if(i.style.display == "none"){
i.style.display = "block";
}else{
i.style.display = "none";
}
}
//-->
</script>
扫一扫
4005
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
