2

我浏览了很多关于这个简单代码的论坛帖子。并尝试了许多变化和方法，但没有任何效果。

我有一个基于数据库查询构建表的脚本。我将其限制为 10 个结果，并提供前进和后退按钮以转到数据库中的其他结果。当您按下下一步按钮时，我需要它删除所有当前表行，以便它可以使用查询的新结果重新创建它们。我正在使用以下代码删除行；

if (document.getElementsByClassName('shiftTrRow')) {
    table = document.getElementById('resultsTable')
    deleteRow = document.getElementsByClassName('shiftTrRow');
    table.removeChild(deleteRow);       
}

我使用 if 案例来检查是否有任何行要删除，我添加了一个警报来测试是否发现了行并且这有效。

当我运行代码时，我在该行收到以下错误：

table.removeChild(deleteRow)

Uncaught Error: NOT_FOUND_ERR: DOM Exception 8

我查看了错误代码，它解释了找不到该元素，但事实并非如此，因为该代码只有在找到该元素时才会执行。如果有人知道我做错了什么或更好的方法来做到这一点，我将不胜感激。

4

3 回答 3

2

document.getElementsByClassName将返回 a NodeList，而不是单个节点。您需要从该列表中选择一个节点，例如document.getElementsByClassName('shiftTrRow')[0].

还要确保节点实际上是给定表的子节点。以下代码更安全一点：

if (document.getElementsByClassName('shiftTrRow'))
{    
    deleteRow = document.getElementsByClassName('shiftTrRow')[0];

    if(deleteRow.parentNode)
        deleteRow.parentNode.removeChild(deleteRow);
}
于 2012-08-05T15:53:51.267 回答
1 
document.getElementsByClassName('shiftTrRow')
                   ^

返回一个NodeList，即一个元素数组。您将需要遍历它们并自行删除它们中的每一个（但请注意，该集合是实时的，并且在您删除元素时会缩小）。

此外，getElementsByClassName可能会返回根本不是该表行的元素，从而导致NOT FOUND您收到异常。

但是，从表中删除行的最简单方法是它的deleteRow方法：

var table = document.getElementById('resultsTable');
while (table.rows.length > 0)
    table.deleteRow(0);
于 2012-08-05T15:52:31.013 回答
1

document.getElementsByClassName返回一个元素数组。table.removeChild它的参数需要一个 DOM 元素，而不是数组。

于 2012-08-05T15:52:56.490 回答