时间戳

首页 > 解决方案 > 使用相同的循环执行太多命令

javascript - 使用相同的循环执行太多命令

问题描述

我有这段代码：

for (var i = 0, row; row = document.getElementById("myTbl").rows[i]; i++) {
    row.cells[headCatg.cellIndex].classList.remove("red");
    row.deleteCell(headCatg.cellIndex);
}

我需要从表格列的每个单元格中删除“红色”类，然后删除该列。我需要首先删除类的原因，因为它已被另一个脚本添加到 DOM，如果我删除该列，则该类只会出现在下一列中。

当我在循环中单独运行这些命令（remove()和deleteCell()）中的每一个时，一切似乎都工作正常，但是当我将它们放在一起时，该列被删除但该类转移到另一列。

我错过了什么？

标签： javascripthtml

解决方案

您必须将其转换HTMLcollection为数组您的代码无法正常工作的原因是因为 HTMLcollection 返回一个活动 NodeList 这意味着当您对集合中的每个元素使用 remove 时，其他元素会重新排列并且列表的长度会变小导致您跳过其中一些，因此您应该使用将 html 集合转换为数组Array.from

row = document.getElementByClassName("myTbl")
rowarr=Array.from(row)


for (var i = 0,  rowarr.length; i++) {
    row[i].cells[headCatg.cellIndex].classList.remove("red");
    row[i].deleteCell(headCatg.cellIndex);
}

推荐阅读