function del(obj){
//这种方法会导致已有的两个删不掉！！！
//var table=document.getElementById("table");
//table.removeChild(obj.parentNode.parentNode);
//这是点赞最多的答案
var tr=obj.parentNode.parentNode;
tr.parentNode.removeChild(tr);
}到底问题出在什么地方？
2017-02-19
我一开始也遇到了你这个问题，后来我想看看传入的obj.parentNode.parentNode的父级元素即obj.parentNode.parentNode.parentNode到底是不是table,就输入了以下代码。
function del(obj)
{
var table = document.getElementById("table");
var thetr = obj.parentNode.parentNode;
alert(thetr.parentNode.nodeName);
}
结果alert弹出的结果却是TBODY而不是table，后来经过一番寻找，在别人的解答中发现了这张图:
"table完整地写法是上述这张图，而我们平时写代码一般都省略其内部的三个子节点<thead> <tfoot> <tbody>，<tr>存在<tbody>中，<tbody>为<tr>父节点，但你运行代码时，浏览器会自动给你添加<thead> <tfoot> <tbody>"
到这里，我就明白原因了。当我们通过id获取table时，<table>与<tr>之间还有<tbody>。
var table=document.getElementById("table");
table.removeChild(obj.parentNode.parentNode);
在这句代码中，table代表的是<table>节点,obj.parentNode.parentNode代表的是<tr>，由于<table>的子节点是<thead> <tfoot> <tbody>而不是<tr>，所以使用removeChild()删除时会失败。
而点赞最多的答案即：
var tr=obj.parentNode.parentNode;
tr.parentNode.removeChild(tr);
这里是直接用tr.parentNode来删除tr这个节点（tr.parentNode这个节点一定是tr的父节点吧）， 所以可以成功删除。
你也可以自己编写代码测试一下。
举报
