IE8提示Invalid procedure call or argument 异常的解决方法


Posted in Javascript onSeptember 30, 2012

1. 环境:
browser_info:"platform:Win32;msie;version:8.0;ie",
navigator:"appCodeName:Mozilla;appName:Microsoft Internet Explorer;appMinorVersion:Release Candidate 1;cpuClass:x86;platform:Win32;systemLanguage:zh-cn;userLanguage:zh-cn;appVersion:4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident\u002F4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729);userAgent:Mozilla\u002F4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident\u002F4.0; .NET CLR 1.1.4322; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729);onLine:true;cookieEnabled:true"
2. 错误代码:

<!DOCTYPE html><html><head></head> 
<body><div></div></body> 
<script> 
alert(document.body.querySelectorAll); 
var els = document.body.querySelectorAll('div'); 
alert(els[2]);// 2 > els.length-1 
</script> 
</html>

3. 原因分析:
以上代码中,els是一个querySelectorAll的结果。els[2]会抛异常,而不是返回undefined.

4. QWrap代码错误点:在QWrap的selector里,有可能会出现对querySelectorAll结果取下标超界。参见以下代码的红色部分

/* 
* nativeQuery(refEl,sSelector): 如果有原生的querySelectorAll,并且只是简单查询,则调用原生的query,否则返回null. 
* @param {Element} refEl 参考元素 
* @param {string} sSelector selector字符串 
* @returns 
*/ 
function nativeQuery(refEl, sSelector) { 
if (hasNativeQuery && /^((^|,)\s*[.\w-][.\w\s\->+~]*)+$/.test(sSelector)) { 
//如果浏览器自带有querySelectorAll,并且本次query的是简单selector,则直接调用selector以加速 
//部分浏览器不支持以">~+"开始的关系运算符 
var oldId = refEl.id, 
tempId, 
arr = [], 
els; 
if (!oldId && refEl.parentNode) { //标准的querySelectorAll中的selector是相对于:root的,而不是相对于:scope的 
tempId = refEl.id = '__QW_slt_' + nativeQueryStamp++; 
try { 
els = refEl.querySelectorAll('#' + tempId + ' ' + sSelector); 
} finally { 
refEl.removeAttribute('id'); 
} 
} 
else{ 
els = refEl.querySelectorAll(sSelector); 
} 
for (var i = 0, elI; elI = els[i++];) arr.push(elI); 
return arr; 
} 
return null; 
}

5. 反思:

代码A:for (var i = 0, len = els.length; i < len; i++) arr.push(els[i]);

代码B:for (var i = 0, elI; elI = els[i++];) arr.push(elI);
用“代码B”代替“代码A”是一种常见写法,可是,碰到这台机器,却?????????琢恕

6. 问题修复:
老老实实的改回代码A。OK了。

7. 延伸:
“下标超界抛异常,而不是返回undefined”这个坑好?住!!
貌似那同学的机器访问淘宝页面,也有类似异常抛出,不知是否是同样原因。友情@淘宝同学一下。

Javascript 相关文章推荐
用jQuery技术实现Tab页界面之二
Sep 21 Javascript
jquery中event对象属性与方法小结
Dec 18 Javascript
jquery解析JSON数据示例代码
Mar 17 Javascript
jQuery+ajax实现鼠标单击修改内容的思路
Jun 29 Javascript
JavaScript ES6的新特性使用新方法定义Class
Jun 28 Javascript
Vue.js实现多条件筛选、搜索、排序及分页的表格功能
Nov 24 Javascript
QRCode.js:基于JQuery的生成二维码JS库的使用
Jun 23 jQuery
深入浅出es6模板字符串
Aug 26 Javascript
JS定义函数的几种常用方法小结
May 23 Javascript
js 使用ajax设置和获取自定义header信息的方法小结
Mar 12 Javascript
微信小程序文章列表功能完整实例
Jun 03 Javascript
解决vue init webpack 下载依赖卡住不动的问题
Nov 09 Javascript
js 手机号码合法性验证代码集合
Sep 29 #Javascript
JavaScript模板入门介绍
Sep 26 #Javascript
JavaScript快速检测浏览器对CSS3特性的支持情况
Sep 26 #Javascript
JavaScript 参数中的数组展开 [译]
Sep 21 #Javascript
JavaScript中将一个值转换为字符串的方法分析[译]
Sep 21 #Javascript
使用apply方法处理数组的三个技巧[译]
Sep 20 #Javascript
js DOM 元素ID就是全局变量
Sep 20 #Javascript
You might like
也谈php网站在线人数统计
2008/04/09 PHP
php入门学习知识点三 PHP上传
2011/07/14 PHP
PHP简单计算两个时间差的方法示例
2017/06/20 PHP
php实现的三个常用加密解密功能函数示例
2017/11/06 PHP
Thinkphp页面跳转设置跳转等待时间的操作
2019/10/16 PHP
javascript 操作Word和Excel的实现代码
2009/10/26 Javascript
JavaScript CSS修改学习第一章 查找位置
2010/02/19 Javascript
js控制的回到页面顶端goTop的代码实现
2013/03/20 Javascript
jQuery自动切换/点击切换选项卡效果的小例子
2013/08/12 Javascript
js onload处理html页面加载之后的事件
2013/10/30 Javascript
js使用for循环查询数组中是否存在某个值
2014/08/12 Javascript
JS动态改变表格边框宽度的方法
2015/03/31 Javascript
javascript实现的字符串与十六进制表示字符串相互转换方法
2015/07/17 Javascript
freemarker判断对象是否为空的方法
2015/08/13 Javascript
JS判断元素是否在数组内的实现代码
2016/03/30 Javascript
[原创]javascript typeof id==='string'?document.getElementById(id):id解释
2016/11/02 Javascript
javascript事件捕获机制【深入分析IE和DOM中的事件模型】
2016/12/15 Javascript
JavaScript中从setTimeout与setInterval到AJAX异步
2017/02/13 Javascript
React进阶学习之组件的解耦之道
2017/08/07 Javascript
对于input 框限定输入值为浮点型的js代码
2017/09/25 Javascript
详解Vue 多级组件透传新方法provide/inject
2018/05/09 Javascript
node.js利用socket.io实现多人在线匹配联机五子棋
2018/05/31 Javascript
详解Angular模板引用变量及其作用域
2018/11/23 Javascript
vue 开发企业微信整合案例分析
2019/12/02 Javascript
深入理解redux之compose的具体应用
2020/01/12 Javascript
python安装教程
2018/02/28 Python
Python实现简单的列表冒泡排序和反转列表操作示例
2019/07/10 Python
BRASTY捷克:购买香水、化妆品、手袋和手表
2017/07/12 全球购物
Farfetch澳大利亚官网:Farfetch Australia
2020/04/26 全球购物
描述一下JVM加载class文件的原理机制
2013/12/08 面试题
LINUX下线程,GDI类的解释
2012/04/17 面试题
上级检查欢迎词
2014/01/18 职场文书
美术专业自荐信
2014/07/07 职场文书
学校安全工作汇报材料
2014/08/16 职场文书
医院办公室主任岗位职责
2015/04/01 职场文书
经费申请报告范文
2015/05/18 职场文书