昨天项目测试的时候,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循环;

关于IE,Chrome,Firefox浏览器的字符串拼接问题的更多相关文章

  1. Selenium加载Chrome/Firefox浏览器配置文件

    Selenium启动浏览器时,默认是打开一个新用户,不会加载原有的配置以及插件.但有些时候我们可能需要加载默认配置. 一.Chrome浏览器 1.在Chrome浏览器的地址栏输入:chrome://v ...

  2. Selenium 加载Chrome/Firefox浏览器配置文件

    Selenium启动浏览器时,默认是打开一个新用户,不会加载原有的配置以及插件.但有些时候我们可能需要加载默认配置. 一.Chrome浏览器 1.在Chrome浏览器的地址栏输入:chrome://v ...

  3. 【转】Selenium 加载Chrome/Firefox浏览器配置文件

    原文地址:https://www.cnblogs.com/eastonliu/p/9083982.html Selenium启动浏览器时,默认是打开一个新用户,不会加载原有的配置以及插件.但有些时候我 ...

  4. chrome,firefox浏览器字体发虚解决办法

    打开微软自家的edge浏览器,字体就没有问题,刚开始以为是浏览器的问题,调整半天也没有效果,后来怀疑是Windows系统的问题,于是尝试调整字体,成功解决! 解决方案: 进入个性化->字体-&g ...

  5. chrome firefox浏览器屏蔽百度热搜

    我是原文 操作 点击拦截元素,然后选择页面元素,添加

  6. Chrome firefox ie等浏览器空格&nbsp;宽度不一样怎么办

    有点强迫症,之前某个页面用了空格 ,但是在chrome firefox 和ie显示的宽度都不一样,无法对齐. 搜索了一下,很多人都转载了那篇设置成宋体的,可是仍然没对齐,要么ie对齐,要么chrome ...

  7. 各种浏览器的Hack写法(chrome firefox ie等)

    Hack是针对不同的浏览器去写不同的CSS样式,从而让各浏览器能达到一致的渲染效果,那么针对不同的浏览器写不同的CSS CODE的过程,就叫CSS HACK,同时也叫写CSS Hack. 然后将Hac ...

  8. IE/Firefox/Chrome等浏览器保存Cookie的位置

    IE/Firefox/Chrome等浏览器保存Cookie的位置 原文  http://smilejay.com/2013/04/browser-cookie-location/   前面写了篇长文( ...

  9. selenium启动firefox、ie、chrome各浏览器方法

    1.启动firefox浏览器 a.如果你的本地firefox是默认路径安装的话,如下方式即可启动浏览器 WebDriver driver = new FirefoxDriver(); driver.g ...

随机推荐

  1. 在jupyter notebook中同时安装python2和python3

    之前讨论过在anaconda下安装多个python版本,本期来讨论下,jupyter notebook中怎样同时安装python2.7 和python3.x. 由于我之前使用的jupyter note ...

  2. 逻辑性最强的React Native环境搭建与调试

    React Native(以下简称RN),已经“火”了好一段时间了,网上的资料相对也很丰富,只是一直迟迟没有发布1.0,不过出身豪门(Facebook)的RN和国内顶级互联网公司对于RN的实践与应用, ...

  3. C语言之复杂链表的复制(图示详解)

    什么是复杂链表? 复杂链表指的是一个链表有若干个结点,每个结点有一个数据域用于存放数据,还有两个指针域,其中一个指向下一个节点,还有一个随机指向当前复杂链表中的任意一个节点或者是一个空结点.今天我们要 ...

  4. XML 新手入门基础知识

    XML 是可扩展标记语言(Extensible Markup Language)的缩写,其中的 标记(markup)是关键部分.您可以创建内容,然后使用限定标记标记它,从而使每个单词.短语或块成为可识 ...

  5. 外部世界如何访问容器? - 每天5分钟玩转 Docker 容器技术(37)

    上节我们学习了容器如何访问外部网络,今天讨论另一个方向:外部网络如何访问到容器? 答案是:端口映射. docker 可将容器对外提供服务的端口映射到 host 的某个端口,外网通过该端口访问容器.容器 ...

  6. gulp 入门指南

    gulp 是基于 node 实现 Web 前端自动化开发的工具,利用它能够极大的提高开发效率. 在 Web 前端开发工作中有很多"重复工作",比如压缩CSS/JS文件.而这些工作都 ...

  7. orcle 索引的使用

    2.4.3.1. 索引的概念 数据库中的索引与书籍中的索引类似,在一本书中,利用索引可以快速查找所需信息, 无须阅读整本书.在数据库中,索引使数据库程序无须对整个表进行扫描, 就可以在其中找到所需数据 ...

  8. 小解系列-解决WebUploader在谷歌浏览器下弹出框打开慢,在Bootstrap模态框内部多次点击才能触发的问题

    WebUploader百度前端团队开源的上传组件,用起来感觉真心不错的,标题的两个问题是我实际使用过程中遇到的问题,经过百度和谷歌查到解决方案, 特分享一下,以供遇到此问题的童靴. 谷歌浏览器弹出框打 ...

  9. 在react.js上使用antd-design没有样式

    两种解决方法: 第一种: 在.babelrc中加入 { "presets": ["es2015", "react"], "plug ...

  10. Java工程师的终极书单

    本份Java工程师的终极书单只在专业的Java技术博客–天天编码上发布,没有授权任何网站与个人转载. 坚持阅读好书是学习Java技术的好方式.但是,市面上与Java技术相关的书籍可谓数不胜数,如何从这 ...