andygui

导航

Javascript遍历Html Table

1: 遍历并输出Table中值
<table id="tb">
   <tr>
      <td></td>
   </tr>
   <tr>
      <td></td>
   </tr>
</table>
function  f()
{
   var t=document.getElementById("tb").childNodes.item(0);
   for(var i=0;i< t.childNodes.length;i++)
   {
      for(var j=0;j<t.childNodes(i).childNodes.length;j++)
         {
            alert(t.childNodes(i).childNodes(j).innerText);
         }
   }
}

2: 遍历Table,读取CheckBox状态和其他Column值
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>Untitled Page</title>
</head>
<body onload="f()">

    <script type="text/javascript">   
        function  f()
        {
           var t=document.getElementById("tb").childNodes.item(0);
          
           for(var i=0;i< t.childNodes.length;i++)
           {
           alert(t.childNodes(i).firstChild.firstChild.nodeValue);
           alert(t.childNodes(i).childNodes[1].firstChild.checked);    
           }
        }

    </script>

    <table id="tb">
        <tr>
            <td style="width: 122px">
                1234</td>
            <td style="width: 89px">
                <input type="checkbox" /></td>
            <td style="width: 210px">
            </td>
        </tr>
        <tr>
            <td style="width: 122px; height: 21px">
                2234</td>
            <td style="width: 89px; height: 21px">
                <input type="checkbox" checked="CHECKED" /></td>
            <td style="width: 210px; height: 21px">
            </td>
        </tr>
        <tr>
            <td style="width: 122px">
                3234</td>
            <td style="width: 89px">
                <input type="checkbox" /></td>
            <td style="width: 210px">
            </td>
        </tr>
    </table>
</body>
</html>

posted on 2007-05-15 18:11  Andy Gui  阅读(3537)  评论(0编辑  收藏  举报