IE浏览器不支持getElementsByClassName的解决方法


Posted in Javascript onAugust 27, 2014

在DOM3里已经加入了getElementsByClassName这个方法,然而IE9、10以外的其它版本均不支持,这是一块伤痛啊!
目前可以这么解决,判断浏览器支不支持这个方法,如果支持就不管;如果不支持,就在document对象里加入getElementsByClassName这个方法,这样的写法有一个好处,即不管有没有原生函数你都不用去修改代码。

网上部分人直接定义一个getElementsByClassName函数,但是这样的话就需要把代码中所有使用document.getElementsByClassName改写成getElementsByClassName。多少有点不方便,也不通用。

下面的方法完美支持了document写法:

if(!document.getElementsByClassName){
  document.getElementsByClassName = function(className, element){
    var children = (element || document).getElementsByTagName('*');
    var elements = new Array();
    for (var i=0; i<children.length; i++){
      var child = children[i];
      var classNames = child.className.split(' ');
      for (var j=0; j<classNames.length; j++){
        if (classNames[j] == className){ 
          elements.push(child);
          break;
        }
      }
    } 
    return elements;
  };
}
Javascript 相关文章推荐
javascript 基础篇4 window对象,DOM
Mar 14 Javascript
js操作CheckBoxList实现全选/反选(在客服端完成)
Feb 02 Javascript
Js判断CSS文件加载完毕的具体实现
Jan 17 Javascript
表单提交前触发函数返回true表单才会提交
Mar 11 Javascript
js选择并转移导航菜单示例代码
Aug 19 Javascript
javascript巧用eval函数组装表单输入项为json对象的方法
Nov 25 Javascript
jQuery防止重复绑定事件的解决方法
May 14 Javascript
详解使用React全家桶搭建一个后台管理系统
Nov 04 Javascript
JavaScript的setter与getter方法
Nov 29 Javascript
Node.JS循环删除非空文件夹及子目录下的所有文件
Mar 12 Javascript
JS开发 富文本编辑器TinyMCE详解
Jul 19 Javascript
解决iview table组件里的 固定列 表格不自适应的问题
Nov 13 Javascript
JavaScript中使用stopPropagation函数停止事件传播例子
Aug 27 #Javascript
JavaScript闭包函数访问外部变量的方法
Aug 27 #Javascript
JavaScript中switch判断容易犯错的一个细节
Aug 27 #Javascript
JavaScript中使用arguments获得函数传参个数实例
Aug 27 #Javascript
JavaScript中输出标签的方法
Aug 27 #Javascript
JavaScript实现的GBK、UTF8字符串实际长度计算函数
Aug 27 #Javascript
JavaScript实现的使用键盘控制人物走动实例
Aug 27 #Javascript
You might like
PHP函数学习之PHP函数点评
2012/07/05 PHP
php禁用函数设置及查看方法详解
2016/07/25 PHP
Linux系统中为php添加pcntl扩展
2016/08/28 PHP
浅析php中array_map和array_walk的使用对比
2016/11/20 PHP
Yii2.0 RESTful API 基础配置教程详解
2018/12/26 PHP
W3C Group的JavaScript1.8 新特性介绍
2009/05/19 Javascript
js+css在交互上的应用
2010/07/18 Javascript
nodejs中exports与module.exports的区别详细介绍
2013/01/14 NodeJs
JSON辅助格式化处理方法
2013/03/26 Javascript
Jquery 获取指定标签的对象及属性的设置与移除
2014/05/29 Javascript
js实现透明度渐变效果的方法
2015/04/10 Javascript
JQuery中DOM实现事件移除的方法
2015/06/13 Javascript
JavaScript如何实现对数字保留两位小数一位自动补零
2015/12/18 Javascript
JS+DIV实现的卷帘效果示例
2017/03/22 Javascript
jQuery EasyUI之验证框validatebox实例详解
2017/04/10 jQuery
详解vue中引入stylus及报错解决方法
2017/09/22 Javascript
基于对象合并功能的实现示例
2017/10/10 Javascript
JavaScript实现简单动态进度条效果
2018/04/06 Javascript
jQuery事件多次绑定与解绑问题实例分析
2019/02/19 jQuery
vueScroll实现移动端下拉刷新、上拉加载
2019/03/22 Javascript
Vue配置marked链接添加target=&quot;_blank&quot;的方法
2019/07/19 Javascript
微信小程序自定义胶囊样式
2020/12/27 Javascript
pandas 两列时间相减换算为秒的方法
2018/04/20 Python
Python学习笔记之图片人脸检测识别实例教程
2019/03/06 Python
python进阶之自定义可迭代的类
2019/08/20 Python
Python实现代码统计工具
2019/09/19 Python
CSS3实现超慢速移动动画效果非常流畅无卡顿
2014/06/15 HTML / CSS
boostrap modal 闪现问题的解决方法
2020/09/01 HTML / CSS
购买限量版收藏品、珠宝和礼品:Bradford Exchange
2016/09/23 全球购物
iHerb台湾:维生素、保健品和健康产品
2018/01/31 全球购物
Aosom西班牙:家具在线商店
2020/06/11 全球购物
《有趣的发现》教学反思
2014/04/15 职场文书
英语教师自荐信
2014/05/26 职场文书
禁止酒驾标语
2014/06/25 职场文书
小学感恩教育活动总结
2014/07/07 职场文书
竞选学习委员演讲稿
2014/09/01 职场文书