javascript 中for in 循环 多循环了一次 这是为什么？

Question

<table class="content" border="1">
<tbody id="time_day">
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</tbody>
</table>
<script>
var th = document.getElementById('time_day').getElementsByTagName('th');
for (var i in th) {alert(i); }

</script>
结果是 0 1 2 3 4 5 6 item namedItem length 。。多了3个这玩意。

Answer 1

你的代码：
var th = document.getElementById('time_day').getElementsByTagName('th');

th获得的是一个HTMLCollection集合，得到的是一个包括七个html标签对象的集合对象，这个集合对象除了有你获得的七个标签对象还有三个属性，length是这个集合对象包含对象的个数，此外还有两个属性：namedItem和item，这就是你说的多三个的原因。
你把代码改成下面的代码执行，就明白了。

<table class="content" border="1">
<tbody id="time_day">
<tr>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
<th></th>
</tr>
</tbody>
</table>
<script>
var th = document.getElementById('time_day').getElementsByTagName('th');
alert(th);
var str="";
for (var i in th) {
str += i + " : " + th[i]+"\n";
}
alert(str);

</script>

Answer 2

遍历的方法不对。不合适用for in

<table class="content" border="1">
    <tbody id="time_day">
    <tr>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
        <th></th>
    </tr>
    </tbody>
</table>
<script>
    var th = document.getElementById('time_day').getElementsByTagName('th');
    //for (var i in th) {alert(i); }
for(var i=0;i<th.length;i++){
    alert(i);
}
// www.hi-docs.com/javascript.html
</script>

追问

大神。 我知道这样就没问题了，但是我还是想知道下原理， 能说下吗？
小菜鸟在这谢谢了！

追答

for in可以遍历对象，th获取到的对象包含了length长度属性，以及item，nameitem属性。
for把该对象当做数组遍历。是无法遍历对象的属性的。

本回答被提问者和网友采纳