昨天项目测试的时候,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);</span>
勾选1和2之后的执行结果:三个浏览器一致的弹出s1,2,
总结一下吧
1.for...in 遍历的不是数组而是对象,所以他遍历访问的是obj的每个属性,而不是数组元素;
2.for....in循环的效率低于for循环;
3.IE貌似不是很好的支持push() [研究ing..........];
4.有待再发现....
相关推荐
然而,随着浏览器技术的发展,尤其是从IE8开始,现代浏览器(包括Chrome、Firefox、Safari、Edge等)对垃圾回收机制进行了优化,并且对`+`运算符连接字符串进行了特殊处理,使得这种方式在大多数情况下性能已经超过...
为了解决这个问题,开发人员开始采用数组的`join`方法来优化字符串拼接。 数组对象提供了一种更高效的方式来组合字符串。例如,我们可以预先创建一个空数组`buffer`,然后通过索引直接添加元素(如`buffer[i++] = ...
2. 测试结果:在一些浏览器(如IE9, IE8, Firefox, Google Chrome, 搜狗等基于IE核心的浏览器)上进行测试后发现,当循环次数达到100,000次以上时,使用+号拼接字符串的方法反而比使用数组的concat方法要快。...
然而,在新版的IE8以及Firefox 3.6、Chrome 4、Safari 4.0.5和Opera 10.50中,情况发生了变化。特别是在IE8中,字符串连接运算符的性能显著提升,甚至超过了数组方法。在Chrome浏览器中,也有类似的现象,即在某些...
在标准模式下,IE8及以下版本不支持通过`setAttribute`直接为元素添加事件监听器,这与现代浏览器如Chrome和Firefox存在差异。为了确保兼容性,通常推荐使用`addEventListener`方法为元素添加事件监听器,但由于IE8...
在Chrome、Firefox等现代浏览器中,通过`document.getElementById`获取元素并直接设置`src`属性的新值,通常能够正常工作,图片会按预期加载。但在IE中,尤其是IE8及以下版本,由于浏览器的实现机制不同,可能会出现...
通过正则表达式匹配的方式,依次检查字符串中是否包含Internet Explorer、Firefox、Chrome、Opera或Safari的相关信息,并存储到对应的属性中。 - **`BROWSER.ShowString`函数**:此函数的作用是根据`BROWSER.SYS`...
1. 浏览器解析差异问题:作者在使用Chrome、IE和Firefox三种不同的浏览器中发现了样式的差异,这表明不同浏览器对HTML和CSS的解析可能存在差异,这通常被称为“浏览器兼容性问题”。了解各种主流浏览器之间的细微...
然而,由于不同的浏览器(如Chrome、Firefox、IE等)对JavaScript的实现存在差异,导致开发者经常会遇到兼容性问题。这篇文章将探讨如何处理JavaScript的兼容性问题以及常用的调试技巧。 首先,要解决JavaScript的...
Ajax的核心是使用XMLHttpRequest对象,这是IE7+、Firefox、Chrome、Opera和Safari等现代浏览器所支持的。对于IE6和IE5浏览器,需要使用ActiveXObject来创建XMLHttpRequest对象。 在创建了XMLHttpRequest对象后,...
但这种方法仅限于IE,并不适用于其他浏览器,如Chrome、Firefox等。 3. **HTML Table导出** - 一种常见方法是将数据转化为HTML表格,然后利用浏览器的默认行为让用户选择打印或保存为.xls文件。这种方式简单,但当...
而在不支持document.selection的浏览器(如Firefox,Chrome等),则需要利用selectionStart和selectionEnd属性来获取选区的起始和结束位置,并通过字符串拼接的方式来实现插入。 以下是详细步骤说明: 1. 获取...
在现代浏览器中,比如Chrome、Firefox或Safari,它们遵循不同的垃圾回收策略,不提供类似的功能。这些浏览器通常使用更先进的垃圾回收算法,如标记-清除、分代收集等,它们能更有效地管理内存,无需开发者手动干预。...
5. **兼容性**:考虑到不同的浏览器可能有不同的实现,插件需要确保在主流浏览器上都能正常工作,比如Chrome、Firefox、Safari和IE。 6. **用户界面**:可能还需要提供一个友好的用户界面,让用户可以方便地选择...
而在Firefox以及其他基于Webkit内核(如Chrome和Safari)的浏览器中,我们需要获取光标的位置,通过操作`value`属性进行字符串的拼接。 以下是JQuery扩展插件的一个示例,它实现了在光标位置插入内容的功能: ```...
这段代码在Chrome和Firefox中可能正常工作,但在IE8中因为`'`未转义导致错误。修正后的代码应将`'`转义为`'`,如下所示: ```javascript inst_html = "<a style=color:white' onmouseover = '"; inst_...
然而,这种方法仅适用于IE浏览器,因为它依赖于`document.selection`和`Range`对象,这些在其他浏览器如Firefox、Chrome或Safari中并不支持。 对于非IE浏览器,我们可以使用`setSelectionRange`和`getSelection()`...
1. **主流浏览器介绍**:包括IE、Firefox、Chrome等浏览器的特点及其支持的特性。 2. **浏览器兼容性问题**:探讨不同浏览器之间的差异,以及如何解决这些兼容性问题。 3. **对象检测**:介绍如何通过JavaScript...
- 字符串拼接使用`.`符号。 - 每条语句以`;`结束。 - **获取表单数据**: - 使用GET和POST方法接收前端表单数据。 - **HTTP请求方式**: - GET请求通常用于获取信息,数据不包含在请求体中。 - POST请求用于提交...