javascript - 如何从 HTMLCollection 中删除一个项目？

Question

我有一些 Javascript 代码可以从 HTMLCollection 中删除一个项目，如下面的代码所示。调用 splice 时出现错误:allInputs.splice is not a function。如果元素类型不是按钮类型，我需要从 HTMLCollection 中删除项目。

问题:如何从这样的集合中删除一个项目？

我可以将未删除的项目传输到一个数组，然后我可以使用该数组而不是原始的 HTMLCollection，但不确定是否有任何其他更短的方法可以做到这一点。

JavaScript 代码

    var allInputs = contentElement.getElementsByTagName('input');
    for (var i = (allInputs.length - 1) ; i >= 0; i--) {
        if (allInputs[i].type !== "button") {
            allInputs.splice(i, 1);//this is throwing an error since splice is not defined
        }
    }

Answer 1

您需要将其从 DOM 中删除，因此替换:

allInputs.splice(i, 1);

与:

allInputs[i].parentNode.removeChild(allInputs[i])

它甚至与 IE 6 等古老的浏览器兼容。该集合将自动更新。反向迭代集合是个好主意，因为每次删除成员时，它都会变短。

注意:

[].slice.call(allInputs)

在像 IE8 这样不允许宿主对象在内置方法中是 this 的浏览器中会失败。