UC知道ajax如何隐藏一列？
来源：百度知道 编辑：UC知道 时间：2024/08/24 19:58:33
<table>
<tr>
<th>姓名</th>
<th>年龄</th>
<th>爱好</th>
</tr>
<tr>
<td>小明</td>
<td>12</td>
<td>看书</td>
<td>小王</td>
<td>14</td>
<td>音乐</td>
</table>
点击th的“爱好”，该列信息隐藏，只显示每个人的年龄信息，再次点击“爱好”的话，该列信息重新显示。这个功能如何实现？
<tr>
<th>姓名</th>
<th>年龄</th>
<th>爱好</th>
</tr>
<tr>
<td>小明</td>
<td>12</td>
<td>看书</td>
<td>小王</td>
<td>14</td>
<td>音乐</td>
</table>
点击th的“爱好”，该列信息隐藏，只显示每个人的年龄信息，再次点击“爱好”的话，该列信息重新显示。这个功能如何实现？
没用到ajax。我写了个。你试试看。
<html>
<head>
<script>
function changediv(name){
var a = document.getElementById(name);
if(a.style.display == "block")
a.style.display = "none";
else
a.style.display = "block"
}
</script>
<style>
.red{background-color:red;width:200;height:200;float:left}
.green{background-color:green;width:200;height:200;float:left}
.yellow{background-color:yellow;width:200;height:200;float:left}
</style>
</head>
<body>
<a href="javascript:changediv('red')">
red
</a>
<a href="javascript:changediv('green')">
green
</a>
<a href="javascript:changediv('yellow')">
yellow
</a>
<div class=red id=red style="display:block">
red
</div>
<