首页 > 编程语言 > 详细

JavaScript 兼容 Array.prototype.slice.call

时间:2014-04-13 00:45:15      阅读:528      评论:0      收藏:0      [点我收藏+]

IE9之前的IE版本的HTMLCollection以及NodeList不是Object的子类。

在通过Array.prototype.slice.call进行数组化的时候,IE9之前的IE版本会抛出异常,因此需要进行兼容处理。

bubuko.com,布布扣
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <style rel="stylesheet" type="text/css">
 6 </style>
 7 <script>
 8 window.onload=function(){
 9     var n=document.getElementsByTagName("div");
10     try{
11         document.body.innerHTML=[].slice.call(n,0);
12     }
13     catch(ex){
14         document.body.innerHTML="ERROR:"+ex.message;
15     }
16 }
17 </script>
18 </head>
19 <body><div class="show">HELLO</div><div></div></body>
20 </html>
bubuko.com,布布扣

兼容实现需要兼容IE9一下的IE版本,动手实现slice方法,
考虑到String对象,Window对象,Function对象,RegExp对象(黑莓4.7中)都有length属性,因此需要排除。
一个可能的实现如下:

bubuko.com,布布扣
 1 <!DOCTYPE html>
 2 <html>
 3 <head>
 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5 <script>
 6 window.onload=function(){
 7     var n=document.getElementsByTagName("div");
 8     try{
 9         document.body.innerHTML+=[].slice.call(n,0);
10     }
11     catch(ex){
12         document.body.innerHTML+="ERROR:"+ex.message;
13     }
14     document.body.innerHTML+="<br/>"+getA(n,0);
15 };
16 
17 var bIEltIE9=(function(){
18     var ag=window.navigator.userAgent.toLowerCase();
19     var reg=new RegExp("msie ([\\S]+);");
20     if(reg.test(ag)){
21         var version=RegExp.$1;
22         if(parseInt(version)<9){
23             return true;
24         }
25     }
26     return false;
27 })();
28 
29 var getA=function(a,start,end){
30     if(a==null){
31         return [];
32     }
33     if(!bIEltIE9){
34         try{
35             return [].slice.call(a,start,end);
36         }
37         catch(ex){}
38     }
39     var ret=[];
40     var i=a.length;
41     // 如果为空或者为字符串或者为函数或者为window对象或者为RegExp
42     if(i==null||typeof a ==="string"||typeof a==="function"||a.setInterval||a instanceof RegExp){
43         ret[0]=a;
44     }
45     else{
46         while(i){
47             ret[--i]=a[i];
48         }
49     }
50     return ret;
51 
52 };
53 
54 </script>
55 </head>
56 <body><div class="show">数组化</div><div></div></body>
57 </html>
bubuko.com,布布扣

更多可以参考:

  • 《JavaScript框架设计 司徒正美》P4 数组化。
  • 《JQuery技术内幕》P68 数组操作方法。

JavaScript 兼容 Array.prototype.slice.call,布布扣,bubuko.com

JavaScript 兼容 Array.prototype.slice.call

原文:http://www.cnblogs.com/xf_z1988/p/3661046.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!