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的更多相关文章

  1. javascript中 Array.prototype.slice的用法.

    首先看到 www.w3school.cn上的解释:http://www.w3school.com.cn/jsref/jsref_slice_array.asp 定义和用法 slice() 方法可从已有 ...

  2. [转] 理解 JavaScript 中的 Array.prototype.slice.apply(arguments)

    假如你是一个 JavaScript 开发者,你可能见到过 Array.prototype.slice.apply(arguments) 这样的用法,然后你会问,这么写是什么意思呢? 这个语法其实不难理 ...

  3. JavaScript中的Array.prototype.slice.call()方法学习

    JavaScript中的Array.prototype.slice.call(arguments)能将有length属性的对象转换为数组(特别注意: 这个对象一定要有length属性). 但有一个例外 ...

  4. 【javascript 技巧】Array.prototype.slice的妙用

    Array.prototype.slice的妙用 开门见山,关于Array 的slice的用法可以参考这里 http://www.w3school.com.cn/js/jsref_slice_arra ...

  5. 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); ...

  6. javascript:Array.prototype.slice.call(arguments)

    我们知道,Array.prototype.slice.call(arguments)能将具有length属性的对象转成数组,除了IE下的节点集合(因为ie下的dom对象是以com对象的形式实现的,js ...

  7. (转)Array.prototype.slice.call自解

    很多框架或者库里面都会有这句的使用,最多的还是通过Array.prototype.slice.call(arguments,0)把arguments这个伪数组转换为真正的数组.但为什么可以这么做,却一 ...

  8. Array.prototype.slice && Array.prototype.splice 用法阐述

    目的 对于这两个数组操作接口,由于不理解, 往往被误用, 或者不知道如何使用.本文尝试给出容易理解的阐述. 数组 什么是数组? 数组是一个基本的数据结构, 是一个在内存中依照线性方式组织元素的方式, ...

  9. Array.prototype.slice.call(document.querySelectorAll('a'), 0)

    Array.prototype.slice.call(document.querySelectorAll('a'), 0)的作用就是将一个DOM NodeList 转换成一个数组. slice()方法 ...

随机推荐

  1. Orcale安装完成后 em管理、性能无法登陆 报:没有找到主机

    先在我的电脑环境变量中加入oracle_sid=orcl 在Orcale主目录中查找emd.properties 文件修改(时间格式) agentTZRegion=GMT agentTZRegion= ...

  2. vsftpd服务安装,配置,限制目录

    一.下载版本:vsftpd-2.0.5-16.el5_4.1.i386.rpm 二.安装:rpm -ivh vsftpd-2.0.5-16.el5_4.1.i386.rpm 三.配置: vsftpd. ...

  3. 在 Mac OS X 中建立加密的 Zip 压缩 -- 让机密资料加上密码

    在 Mac OS X 中要压缩档案的話,基本上就用滑鼠点右鍵选「压缩...」就可以制作 Zip 格式的压缩档,很方便.但如果是机密的资料要透过 Email 等管道传送时,常常会需要建立加密的 Zip ...

  4. SVM推导

    标准最大margin问题 假设data是linear seperable的 优化目标 希望 margin(w),i.e, 最小的点到直线的距离 最大 即是要得到最右的线,它对噪声的鲁棒性最好 得到的分 ...

  5. CSS3—CSS3和现代Web设计

    1.1 现代Web设计理念 1.1.1 可访问性第一 同样一段内容, 可以用成千上万的方法为其设计样式, 但全世界的用户应该依然可以访问它们, 不管他们用什么方式去访问Web——无论手机.键盘控制器还 ...

  6. 我的Hibernate入门

    今天忙了一整天,终于搭建好了我的第一个Hibernate程序,中间关于hibernate.cfg.xml的问题搞了半天,不过最后还是搞明白了,下面来讲一讲过程. 首先在你的eclipse中安装Hibe ...

  7. BOM 之 location

    BOM 之 location它提供了与当前窗口中加载的文档有关的信息,还提供一些导航功能 .既是 window对象的属性,也是document对象的属性,就是说, window.location 和 ...

  8. [转]操作xml,将xml数据显示到treeview的C#代码

    XmlDocument xml = new XmlDocument(); private void Form1_Load(object sender, EventArgs e) { CreateXML ...

  9. 如何删除github上的项目

    如果大伙用过github,那么就会知道它上面没有明显的选项可以让你直接删除掉一个Repositories或者项目.因此对很多github的新手来说一开始也常觉得这个事情比较犯难.这里我给大家简单介绍一 ...

  10. 静态代理VS动态代理

    代理Proxy: Proxy代理模式是一种结构型设计模式,主要解决的问题是:在直接访问对象时带来的问题 代理是一种常用的设计模式,其目的就是为其他对象提供一个代理以控制对某个对象的访问.代理类负责为委 ...