问个js控制表格的问题

Question

我查询一个表得到一组数据，显示在一个表格中，显示方式是；打个比方，第一行显示1,2，3两行显示与1相关的两条数据，第四行显示2,5,6两行显示与2相关的两条数据。现在我想通过js实现这样的效果。默认只显示1.4两条数据，如果点击这两条记录，则显示与分别与它们相关的2条记录

Answer 1

/*
我看懂你的意思了。
默认只显示两行分别是你说的第一行和第四行。
点击第一行，显示跟第一行相关的第二、三行。如果第二、三行的数据有相关的信息那就好办了
相关信息如下：第一行id为p1,那么它下面的第二行、第三行name为c1,这样就可以把它们关联起来
你从数据库查出的信息应该有此数据
*/
<script language="javascript">
function showChild(e){
  var trs = document.getElementsByName(e);
  for(var i=0;i<trs.length;i++){ 
      if(trs[i].style.display == "none"){
         trs[i].style.display = "block";
      }else if(trs[i].style.display == "block"){
         trs[i].style.display == "none";
      }
  }
}
</script><table>
    <tr id="p1" onclick="showChild('c1')"><td>第一行</td></tr>
    <tr name="c1" style="display:none"><td>第2行</td></tr>
    <tr name="c1" style="display:none"><td>第3行</td></tr>
    <tr id="p4" onclick="showChild('c1')"><td>第四行</td></tr>
    <tr name="c4" style="display:none"><td>第5行</td></tr>
    <tr name="c4" style="display:none"><td>第6行</td></tr>
</table>

Answer 2

//这行写错了
<tr id="p4" onclick="showChild('c1')"><td>第四行</td></tr>
//应该是
<tr id="p4" onclick="showChild('c4')"><td>第四行</td></tr>

Answer 3

代码好像只能在firefox运行，IE运行不了

Answer 4

 var trs = document.getElementsByName(e);
这一句他在IE下面获取不到，你可以想点其他方式获取，比如table下面的childNode之类的吧

Answer 5

<table id="tab" width="200px" border="1" align="center">
</table>
<SCRIPT LANGUAGE="JavaScript">
<!--
//数据
var ralative = 0;
var self = 1;
var re = 2
var arr = new Array();
arr[0] = [0,1,"root"];
arr[1] = [1,2,"与1相关"];
arr[2] = [1,3,"与1相关"];
arr[3] = [0,4,"root"];
arr[4] = [4,5,"与4相关"];
arr[5] = [4,6,"与4相关"];var tab = document.getElementById("tab");
//画表
addRows();
function addRows(){
for (var i=0; i<arr.length; i++)
{
var newrow = tab.insertRow();
newrow.para = "row" + arr[i][ralative];
var newcell = newrow.insertCell();
newcell.width = "50px";
if ( arr[i][ralative] == 0) {
newrow.bgColor = "#DDDDFF";
newcell.innerHTML = '<a href="#" onclick="fun('+ arr[i][self] +')"><b>'+ arr[i][self] + '</b></a>';
}
else {
newrow.style.display = "none";
newcell.innerHTML = arr[i][self];
}
var newcell = newrow.insertCell();
newcell.innerHTML = arr[i][re];
}
}
//控制折叠/展开
function fun(rela){
for (var i=0; i<tab.rows.length; i++)
{
if (tab.rows[i].para == "row" + rela)
{
if (tab.rows[i].style.display == "none") tab.rows[i].style.display = "block";
else tab.rows[i].style.display = "none";
}
}
}
//-->
</SCRIPT>