JS代码问题,下列代码求解

<!DOCTYPE html>
<html>
 <head>
  <title> new document </title>  
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>   
  <script type="text/javascript">  
     window.onload = function(){  //网页加载事件
        Highlight();
     }  
     
     function Highlight(){
         var tbody = document.getElementById('table').lastChild;    //table节点的最后一个子节点不是最后一个tr节点嘛?怎么成数组了?
        trs = tbody.getElementsByTagName('tr');   
        for(var i =1;i<trs.length;i++){    
            trs[i].onmouseover = function(){
                this.style.backgroundColor ="#f2f2f2";
            } 
            trs[i].onmouseout = function(){
                this.style.backgroundColor ="#fff";
            } 
        }  
     }
          
     function addOne(obj){ 
        var tbody = document.getElementById('table').lastChild;  
        var tr = document.createElement('tr');  
         
         var td = document.createElement("td");
         td.innerHTML = "<input type='text'/>";
         tr.appendChild(td);
         
         td = document.createElement("td");     
         td.innerHTML = "<input type='text'/>";
         tr.appendChild(td);
         
         td = document.createElement("td");    
         td.innerHTML = "<a href='javascript:;' onclick='deleteRow(this)'>删除</a>";
         tr.appendChild(td);   
         
         tbody.appendChild(tr);   //table节点的最后一个子节点不是最后一个tr节点嘛?再添加tr?
        Highlight();
        }

     function deleteRow(obj){
        var tbody = document.getElementById('table').lastChild;   //table节点的最后一个子节点不是最后一个tr节点嘛?对它做移除tr怎么个意思?
        var tr = obj.parentNode.parentNode;
         tbody.removeChild(tr);
     }


  </script> 
 </head> 
 <body> 
       <table border="1" width="50%" id="table">
       <tr>
        <th>学号</th>
        <th>姓名</th>
        <th>操作</th>
       </tr>  

       <tr>
        <td>xh001</td>
        <td>王小明</td>
        <td><a href="javascript:;" onclick="deleteRow(this)">删除</a></td>
       </tr>

       <tr>
        <td>xh002</td>
        <td>刘小芳</td>
        <td><a href="javascript:;" onclick="deleteRow(this)">删除</a></td>
       </tr>  

       </table>
       <input type="button" value="添加一行" onclick="addOne()" />
 </body>
</html>

var tbody = document.getElementById('table').lastChild; 这里id为table的table节点的最后一个子节点不是最后一个tr节点嘛?不是只有一个嘛?怎么成数组了?

阅读 2.3k
2 个回答

Hello,返回的不是数组节点。而是table下的tbody节点标签。
现代浏览器为适应w3c标准自行添加了这个标签。
图片描述

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题