从javascript表中删除行的不同方法_Javascript

从javascript表中删除行的不同方法

javascript

从javascript表中删除行的不同方法,javascript,Javascript,我想使用3个不同的函数从表中删除特定的行。函数deleteRow（）和deleteRow2似乎工作正常，但deleteRow3工作不正常。你能解释一下为什么吗 <html> <body> <table id="myTable"> <tr> <td>Row 1</td> <td><input type="button" value="Delete" oncl

我想使用3个不同的函数从表中删除特定的行。函数deleteRow（）和deleteRow2似乎工作正常，但deleteRow3工作不正常。你能解释一下为什么吗

 <html>
  <body>
    <table id="myTable">
     <tr>
       <td>Row 1</td>
       <td><input type="button" value="Delete" onclick="deleteRow(this)"></td>
     </tr>
     <tr>
       <td>Row 2</td>
       <td><input type="button" value="Delete" onclick="deleteRow2(this)"></td>
     </tr>
     <tr>
       <td>Row 3</td>
       <td><input type="button" value="Delete" onclick="deleteRow3(this)"></td>
     </tr>
   </table>

  <script>
    function deleteRow(el){   // this function works
      var i = el.parentNode.parentNode.rowIndex;
      document.getElementById("myTable").deleteRow(i);
    }
    function deleteRow2(el){  // this also
      var row = el.parentNode.parentNode;
      row.parentNode.removeChild(row);
    }
    function deleteRow3(el){  // and this dont' work
      var row = el.parentNode.parentNode;
      document.getElementById("myTable").removeChild(row);
    }

  </script>
  </body>
</html>


一排
第2排
第3排
函数deleteRow（el）{//此函数有效
var i=el.parentNode.parentNode.rowIndex；
document.getElementById（“myTable”）.deleteRow（i）；
}
函数deleteRow2（el）{//这也是
var row=el.parentNode.parentNode；
row.parentNode.removeChild（row）；
}
函数deleteRow3（el）{//这不起作用
var row=el.parentNode.parentNode；
document.getElementById（“myTable”）.removeChild（行）；
}

浏览器在您的

和

之间插入一个

标记-因此

行

不是

的直接子行
浏览器在您的
和
之间插入一个
标记-因此行
不是的直接子行
，这是因为浏览器正在向表中插入一个
元素，从而使该行不再是表的直接子行，而是
的子行
这将有助于：
document.getElementById("myTable").children[0].removeChild(row);

这是因为浏览器正在将
元素插入到表中，从而使该行不再是表的直接子行，而是
的子行
这将有助于：
document.getElementById("myTable").children[0].removeChild(row);