javascript：全部数组 <select>项目返回未定义。为什么？

Question

我混合了一系列<input>和<select>项目。 我想用这些项目在页面上显示的数组来填充它们。

我以相同的方式创建了inputItemsArray和selectItemsArray ：

var inputItemsArray = document.getElementsById("formGroup").getElementsByTag("input");
var inputSelectArray = document.getElementsById("formGroup").getElementsByTag("select");

input数组工作得很好。 select数组返回未定义。 为什么？

我想做的是将submit数组的内容拼接到input数组中，然后将这些元素的值转储到最终数组中。

如果我只是使用input数组，它会很好地工作，但是因为select数组是未定义的...

这是代码：

var clientInputArray = document.getElementById("clientData").getElementsByTagName("input");
var clientSelectAray = document.getElementById("clientData").getElementsByTagName("select");

clientInputArray.splice(4,0,clientSelectArray[0]);  //  insert townType into array
clientInputArray.splice(5,0,clientSelectArray[1]);  //  insert province into array

console.log("clientInputArray: " + clientInputArray);

for (data in clientArray)
{
    if (clientArray[data].length != 0)
    {
        clientData.push(clientArray[data].value);
        console.log("data: " + data);
    } else {    //  because the last two elements of the array are empty...don't know why...
            break;
    }
}   
console.log("clientData: " + clientData);   
//clientData.push(companyName);

因此，请重申一下：为什么select版本返回未定义？

WR！

Answer 1

var inputItemsArray = document.getElementsById("formGroup").getElementsByTag("input");
var inputSelectArray = document.getElementsById("**formsGroup**").getElementsByTag("select");

您在FormsGroup中不应该有一个's'。这就是为什么您未定义的原因。

Answer 2

您的问题是：

1. 您将getElementsByTagName的结果视为一个数组，但实际上是一个NodeList 。
2. 您正在for (a in b)迭代使用惰性for (a in b)而不是使用适当的数字for循环。

这是更新和简化的测试： http : //jsfiddle.net/MMXKW/2/

如你看到的：

• 两者的结果都具有非零长度。
• 当在NodeList上使用for (a in b)进行迭代时for (a in b)您还将获得length和item的可枚举属性。

而是使用：

var selects = myForm.getElementsByTagName('select');
for (var i=0,len=selects.length;i<len;++i){
  var select = selects[i];
  // ...
}

附带说明一下，当您写for (foo in bar)您还创建了一个全局foo变量。 当您实际上需要枚举对象的属性而不是枚举Array或类似Array的对象的数值时，通常应该使用for (var foo in bar) 。