tr节点的父节点并非table,而是tbody,(为什么有个lastChild)

最新推荐文章于 2022-09-19 16:43:54 发布

路痴2号

最新推荐文章于 2022-09-19 16:43:54 发布

阅读量1.2k

点赞数 2

文章标签： Javascript基础 childNodes parentNode

本文链接：https://blog.csdn.net/weixin_42583106/article/details/100655051

版权

本文探讨了在使用JavaScript删除表格行时遇到的问题，指出tr的父节点实际上是tbody，而不是直接的table元素。通过添加lastChild来正确获取tbody节点，从而成功执行删除操作。内容包括对table子节点的遍历分析，揭示了一个隐藏的空白节点和实际的tbody节点。

摘要由CSDN通过智能技术生成

最近博主在慕客网上学习javascript时遇上了一道题，是要利用JavaScript删除表格中的一行，表格如下：
点击删除文字后就可以删除该行

xh001 王小明删除

<tr>
    <td>xh002</td>
    <td>刘小芳</td>
    <td><a href="javascript:;" onclick="deleteRow(this)">删除</a></td>
</tr>
于是我这么写了个函数

function deleteRow(obj){
var tbody = document.getElementById(‘table’);
var tr = obj.parentNode.parentNode;
tbody.removeChild(tr);
}
但是完全执行不了？？？
我一脸懵！！！
于是搜索了答案，发现正确答案是这样的
function deleteRow(obj){
var tbody = document.getElementById(‘table’).lastChild;//看见了吗，多了一个lastChild
var tr = obj.parentNode.parentNode;
tbody.removeChild(tr);
}

于是我遍历了一下table的子节点，发现table节点之下有两个节点