HTML JS只有一半的选择列表被删除？

Question

这很奇怪,我试图清除我的选择列表,正好有一半被清除,而不是一切.它也是留下的所有其他项目.我没有在这里包含数据,只是选择列表的设置.数据为10个项目,仅删除5个.UniList调用DeleteAll.第一个警报输出'10',第二个警告输出'5'

DID只是document.getelementbyid()

function DeleteAll(string) {

       var i;
       var list = DID(string);

       alert(DID(string).options.length);

       for (i = 0; i<list.options.length; i++) {
           list[i] = null;
       }
       alert(list.options.length);
       alert("finished deleting");
}

<select size='12' name='UniList' id='UniList' style='width:180px;' onclick=changeuni('UniList','Uni')>
    <option value=''></option>
    <option value=''></option>
    <option value=''></option>
</select>

Answer 1

list.options是一个假定为live的HTMLOptionsCollection:

注意: HTML DOM中的集合被假定为实时,这意味着它们会在更改基础文档时自动更新.

因此,每次迭代时,都会删除一个项目,list.options并更新文档,以便进行list.options.length更新.因此,不是删除列表的第一个,第二个,第三个等选项,而是实际删除第一个,第三个,第五个等选项.

使用list.options[0]而不是始终删除第一个选项:

while (list.options.length > 0) {
    list.options[0] = null;
}

或者从后面删除选项:

for (i = list.options.length-1; i>=0; i--) {
    list.options[i] = null;
}

顺便说一下:HTMLSelectElement有一个remove方法可以通过索引删除选项:

while (list.length > 0) {
    list.remove(0);
}