confuse about the parentNode

confuse about the parentNode

本文关键字：parentNode the about confuse      更新时间：2023-09-26

我对JS中的parentNode感到困惑。这是我的密码。

<table border="1" width="50%" id="table">
   <tr>
    <th>id</th>
    <th>name</th>
    <th>del</th>
   </tr>  
   <tr>
    <td>001</td>
    <td>Kevin</td>
    <td><a href="javascript:;" onclick="del(this);">del</a></td>   
   </tr>

JS代码：

function del(obj){
     var tr = obj.parentNode.parentNode;
     tr.parentNode.removeChild(tr)
 }

代码有效，我认为obj指<a>标签，obj.parentNode指<td>标签，obj.parentNode.parentNode指<tbody>标签。所以CCD_ 7意味着移除CCD_。我说得对吗？

问题是，如果我这样更改代码。它不起作用。

function del(obj){
     var tr = obj.parentNode.parentNode.parentNode;
     tr.removeChild(tr)
 }

的原因

tr.removeChild(tr)

不起作用是因为tr不是tr的子级，即它本身。然而，tr.parentNode.removeChild(tr)之所以有效，是因为tr显然是tr.parentNode的子代。

removeChild将在调用函数的节点中查找节点。换句话说，tr.removeChild正在tr的内部查找tr。请尝试以下操作：

var tr = obj.parentNode.parentNode;
var trParent = tr.parentNode;
trParent.removeChild(tr);

我不得不处理同样的问题，答案令人困惑与直觉相反。好吧，它有它的逻辑，但导致了非琐碎的行为。

从本质上讲，当一个节点从DOM树中移除时，它会引发一个模糊事件（以及聚焦事件之前）。

因此，当您调用removeChild时，模糊事件会再次触发，但时间链接仍然定义了parentNode，但链接不在其不再是父母的孩子了！（是的，读两遍。或者更多。）

来自执行失败的回答'；removeChild'；在'；节点'；

相关文章：