Javascript清除选择框的内容

Question

作为填充选择框功能的一部分，我正在清除填充选择框的内容，然后将选项插入一个空框。 虽然选择框没有被正确清除，很多选项也没有被删除。 我正在使用以下代码清除选择框的内容：

for(var i = 0; i < document.getElementById(selectbox).options.length; i++)
    document.getElementById(selectbox).options[i] = null;

为什么不从选择框中删除所有选项？

Answer 1

你可以简单地做

 document.getElementById(selectbox).options.length = 0;

您也可以一个一个地删除元素，就像您所做的那样，但是您必须考虑到迭代时options的长度会发生变化的事实。 迭代时删除的正确方法是

for (var i=document.getElementById(selectbox).options.length; i-->0;)
    document.getElementById(selectbox).options[i] = null;

但第一个解决方案当然更简单。

Answer 2

var selectbox = document.getElementById(selectbox);

document.getElementById("emptyBox").innerHTML = selectbox.innerHTML;
selectbox.innerHTML = "";

Answer 3

作为清除选择列表中所有选项的另一种更简洁的方法，我们可以利用 JavaScript 的 falsey 值为零，然后简单地从 Dom 中删除选项：

function clearSelectList(list) {
    // when length is 0, the evaluation will return false.
    while (list.options.length) {
        // continue to remove the first option until no options remain.
        list.remove(0);
    }
}

用法将是：

var list = document.getElementById("selectbox");
clearSelectList(list);

或者更简洁：

clearSelectList(document.getElementById("selectbox"));

Answer 4

这个例子使用了新一代的 JavaScript。 我建议使用。

[...cbrCenterSelectbox.options].forEach(option => option.remove())