JavaScript 兼容 Array.prototype.slice.call
IE9之前的IE版本的HTMLCollection以及NodeList不是Object的子类。
在通过Array.prototype.slice.call进行数组化的时候,IE9之前的IE版本会抛出异常,因此需要进行兼容处理。
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<style rel="stylesheet" type="text/css">
</style>
<script>
window.onload=function(){
var n=document.getElementsByTagName("div");
try{
document.body.innerHTML=[].slice.call(n,0);
}
catch(ex){
document.body.innerHTML="ERROR:"+ex.message;
}
}
</script>
</head>
<body><div class="show">HELLO</div><div></div></body>
</html>
兼容实现需要兼容IE9一下的IE版本,动手实现slice方法,
考虑到String对象,Window对象,Function对象,RegExp对象(黑莓4.7中)都有length属性,因此需要排除。
一个可能的实现如下:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<script>
window.onload=function(){
var n=document.getElementsByTagName("div");
try{
document.body.innerHTML+=[].slice.call(n,0);
}
catch(ex){
document.body.innerHTML+="ERROR:"+ex.message;
}
document.body.innerHTML+="<br/>"+getA(n,0);
}; var bIEltIE9=(function(){
var ag=window.navigator.userAgent.toLowerCase();
var reg=new RegExp("msie ([\\S]+);");
if(reg.test(ag)){
var version=RegExp.$1;
if(parseInt(version)<9){
return true;
}
}
return false;
})(); var getA=function(a,start,end){
if(a==null){
return [];
}
if(!bIEltIE9){
try{
return [].slice.call(a,start,end);
}
catch(ex){}
}
var ret=[];
var i=a.length;
// 如果为空或者为字符串或者为函数或者为window对象或者为RegExp
if(i==null||typeof a ==="string"||typeof a==="function"||a.setInterval||a instanceof RegExp){
ret[0]=a;
}
else{
while(i){
ret[--i]=a[i];
}
}
return ret; }; </script>
</head>
<body><div class="show">数组化</div><div></div></body>
</html>
上面代码的function和window判断不严瑾,具体参考:JavaScript 类型判断 —— typeof 以及 instanceof 中的陷阱。
更多可以参考:
- 《JavaScript框架设计 司徒正美》P4 数组化。
- 《JQuery技术内幕》P68 数组操作方法。
JavaScript 兼容 Array.prototype.slice.call的更多相关文章
- javascript中 Array.prototype.slice的用法.
首先看到 www.w3school.cn上的解释:http://www.w3school.com.cn/jsref/jsref_slice_array.asp 定义和用法 slice() 方法可从已有 ...
- [转] 理解 JavaScript 中的 Array.prototype.slice.apply(arguments)
假如你是一个 JavaScript 开发者,你可能见到过 Array.prototype.slice.apply(arguments) 这样的用法,然后你会问,这么写是什么意思呢? 这个语法其实不难理 ...
- JavaScript中的Array.prototype.slice.call()方法学习
JavaScript中的Array.prototype.slice.call(arguments)能将有length属性的对象转换为数组(特别注意: 这个对象一定要有length属性). 但有一个例外 ...
- 【javascript 技巧】Array.prototype.slice的妙用
Array.prototype.slice的妙用 开门见山,关于Array 的slice的用法可以参考这里 http://www.w3school.com.cn/js/jsref_slice_arra ...
- javascript:Array.slice.call 到Array.prototype.slice.call
举个从对象到数组的例子: var obj={}; obj[1]=1; obj[2]=2; obj.length=2; var arr =Array.prototype.slice.call(obj); ...
- javascript:Array.prototype.slice.call(arguments)
我们知道,Array.prototype.slice.call(arguments)能将具有length属性的对象转成数组,除了IE下的节点集合(因为ie下的dom对象是以com对象的形式实现的,js ...
- (转)Array.prototype.slice.call自解
很多框架或者库里面都会有这句的使用,最多的还是通过Array.prototype.slice.call(arguments,0)把arguments这个伪数组转换为真正的数组.但为什么可以这么做,却一 ...
- Array.prototype.slice && Array.prototype.splice 用法阐述
目的 对于这两个数组操作接口,由于不理解, 往往被误用, 或者不知道如何使用.本文尝试给出容易理解的阐述. 数组 什么是数组? 数组是一个基本的数据结构, 是一个在内存中依照线性方式组织元素的方式, ...
- Array.prototype.slice.call(document.querySelectorAll('a'), 0)
Array.prototype.slice.call(document.querySelectorAll('a'), 0)的作用就是将一个DOM NodeList 转换成一个数组. slice()方法 ...
随机推荐
- 导出excel的简单方法
excel的操作,最常用的就是导出和导入,废话不多说上代码. 本例使用NPOI实现的,不喜勿喷哈.... /// <summary> /// 导出Excel /// </summar ...
- Shell: extract more from listener.log(分析监听日志)
最近遇到了两起数据库连接数不足的问题, 通常都会预留一些会话增加的情况, 但在一些特殊情况下如连接风暴(logon storm), 如果在监听中没有做rate限流,对数据库来说巨大的冲击可能会导致数据 ...
- JQuery 多个ID对象绑定一个click事件
一.表单的多个radio对象绑定click: $("#ImgRadio :radio").click(function(){ func(); });
- 类库探源——System.Delegate
一.MSDN 描述 Delegate 类:表示委托,委托是一种数据结构,它引用静态方法或引用类实例及该类的实例方法.(是不是感觉很像C语言中的函数指针 :) ) 命名空间: System 程序集: ...
- POJ_3143 验证“歌德巴赫猜想”
今天晚上的火车回家啦.所以提前更出来~.愉快的收拾我的包裹~滚回家吃半个月~胖几斤又要回学校啦~ T T这个假期虽然很忙.但是我觉得很有意义.很有价值~爱你们~ 描述 验证“歌德巴赫猜想”,即:任意一 ...
- 《C++ Primer》P314中使用insert重写单词统计程序的扩展
编写程序统计并输出所读入的单词出现的次数 想与习题10-1相结合,也就是先输入几组 map<string, int>类型,存入vector中. 再输入单词word,如果已经存在则在key对 ...
- 要想重启后也生效LINUX防火墙配置
新配置的一台服务器,安装的是CentOS6.3系统,在安装完LNMP之后,发现nginx进程存在,且php解析正常,但是用分配的独立IP去访问的时候发现无法访问. 查了下网上的资料,发现可能是Linu ...
- 站点下的GridView的RowCommand事件的设置,与站点应用不一样
<ItemTemplate> <%--<a ...
- jQuery开发技术笔记
HTML DOM 加载步骤 1. 解析 HTML 结构 2.加载外部脚本和样式表文件 3.解析并执行脚本代码 4.构造 HTML DOM 模型 5.加载图片等外部 ...
- ThinkPHP Uploadify 图片上载
从官方网站下载的Uploadify最新版本:http://www.uploadify.com/download/ jQuery库是1.7.1版本. 下载好的Uploadify目录下面的文件有: 用到的 ...