Question

我试图为distinctCtyNames数组中的每个元素添加一个div。但是，如果我按下按钮一次，它只会创建几个div，我必须多次按下按钮才能弹出所有元素并使它们成为div。当我使用for(i=0;i<length;i++){ctyName = distinctCtyNames[i] /*and create div*/}时，没有这样的问题

我的代码如下：

<input type="submit" name="BtnLogin" value="addDiv" onclick="addDiv()" id="addDiv" style="height:26px;width:100px;Z-INDEX: 105; LEFT: 440px; TOP: 72px"/>

和

console.log(distinctCtyNames);
for (ctyName in distinctCtyNames){
        var element = document.createElement('div');
        ctyName = distinctCtyNames.pop();
        element.id = ctyName;
        element.style['cssText'] = "width: 1000px; height: 400px; margin: 0px auto;"
        oContent.appendChild(element);
    }

Answer 1

使用ctyName方法在for循环中重新分配array.pop var 当你从头开始迭代时，pop将删除数组中的LAST元素，当你移除最后一个元素时，数组将会改变，因此不会迭代整个数组。
运行循环时，将为ctyName数组中的每个实例设置distinctCtyNames var。

 for (ctyName in distinctCtyNames) { ...

可写：

 for(var i=0,len=distinctCtyNames.length;i<len;i++) {
   var ctyName = distinctCtyNames[i];

在循环中停止使用pop方法，它应该可以正常工作。

Answer 2

问题1 ：重新分配值
您正在使用

迭代数组

for (ctyName in distinctCtyNames)

同时，您正在使用并重新分配ctyName值从此数组中删除元素。

ctyName = distinctCtyNames.pop();

例如，你有一个数组：

['Toronto', 'Moscow', 'New York', 'Paris']

你的for-loop需要多伦多＆＃39;并将其分配给ctyName。现在，在循环中，您ctyName = distinctCtyNames.pop()和ctyName等于Paris。你失去了多伦多＆＃39;值。

这就是你的循环错过某些值的原因。你不应该这样做。

问题2：for使用不正确。
此外，当您使用for循环遍历数组时，它会遍历键。您应该使用密钥获取值。

一切正常：

for (ctyKey in distinctCtyNames) // changed to ctyKey
{
    var ctyName = distinctCtyNames[ctyKey]; // get ctyName using array[key]
    var element = document.createElement('div');
    element.id = ctyName;
    element.style['cssText'] = "width: 1000px; height: 400px; margin: 0px auto;"
    oContent.appendChild(element);
}

这是工作JSFiddle Demo。

然而，使用for in遍历数组是一种不好的做法阅读更多相关信息at this StackOverflow topic。

javascript for循环不会迭代所有元素

2 个答案: