关于IE,Chrome,Firefox浏览器的字符串拼接问题

昨天项目测试的时候，IE8、IE11测试勾选checkbox然后执行保存的时候，竟然执行的结果与预期相反，吓屎我了，最终排查之下，原来是拼接checkbox的值的时候出现的问题。本人对js了解知之甚少，用的不多，最近几个项目都是大批的js，遇到各种小白问题，没办法只好慢慢学了。

HTML代码:

<input type="checkbox" name="test" value="1"/><span>1</span>
<input type="checkbox" name="test" value="2"/><span>2</span>
<input type="checkbox" name="test" value="3"/><span>3</span>
<input type="checkbox" name="test" value="4"/><span>4</span>
<input type="checkbox" name="test" value="5"/><span>5</span><br>
<input type='button' value='提交' onclick="fun()"/></span>

原js代码：

var obj = document.getElementsByName("test");
check_val = [];
for(k in obj){
     if(obj[k].checked){
          check_val.push(obj[k].value);
    }
}
alert(check_val.length);

勾选1和2之后的执行结果：IE弹出0，Chrome和Firefox弹出2;

 

难道是IE不支持push()?

修改如下的js:

var obj = document.getElementsByName("test");
var s='';
for(k in obj){
      if(obj[k].checked){
      s+=obj[k].value+',';
    }        
}
alert("s"+s);

勾选1和2之后的执行结果：IE弹出s，Chrome和Firefox弹出s1,2,;

 

真奇怪，怎么IE又闹特别了呢？好吧，继续改

再次修改之后的js:

var obj = document.getElementsByName("test");
var s='';
for(k=0;k<obj.length;k++){
    if(obj[k].checked){
      s+=obj[k].value+',';
    }        
}
alert("s"+s);

勾选1和2之后的执行结果：三个浏览器一致的弹出s1,2,

 

总结一下吧

1.for...in 遍历的不是数组而是对象，所以他遍历访问的是obj的每个属性，而不是数组元素;

2.for....in循环的效率低于for循环;