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 相关文章推荐
JS小框架 fly javascript framework
Nov 26 Javascript
JavaScript执行顺序详细介绍
Dec 04 Javascript
Bootstrap每天必学之基础排版
Nov 20 Javascript
Bootstrap项目实战之子栏目资讯内容
Apr 25 Javascript
JS与Ajax Get和Post在使用上的区别实例详解
Jun 08 Javascript
详解Jquery Easyui的验证扩展
Jan 09 Javascript
jQuery实现淡入淡出的模态框
Feb 09 Javascript
bootstrap tooltips在 angularJS中的使用方法
Apr 10 Javascript
抖音上用记事本编写爱心小程序教程
Apr 17 Javascript
element-ui 中使用upload多文件上传只请求一次接口
Jul 19 Javascript
ES6学习笔记之字符串、数组、对象、函数新增知识点实例分析
Jan 22 Javascript
JavaScript原型链中函数和对象的理解
Jun 16 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实现把url转换迅雷thunder资源下载地址的方法
2014/11/07 PHP
PHP面向对象程序设计组合模式与装饰模式详解
2016/12/02 PHP
Laravel框架路由设置与使用示例
2018/06/12 PHP
PHP等比例压缩图片的实例代码
2018/07/26 PHP
PHP使用观察者模式处理异常信息的方法详解
2019/09/24 PHP
js去除重复字符串两种实现方法
2013/01/09 Javascript
解析JavaScript中的标签语句
2013/06/19 Javascript
Jquery同辈元素选中/未选中效果的实例代码
2013/08/01 Javascript
JavaScript限定图片显示大小的方法
2015/03/11 Javascript
js一维数组、多维数组和对象的混合使用方法
2016/04/03 Javascript
js生成随机数(指定范围)的实例代码
2016/07/10 Javascript
一步一步封装自己的HtmlHelper组件BootstrapHelper(三)
2016/09/14 Javascript
vue2.0 自定义日期时间过滤器
2017/06/07 Javascript
React操作真实DOM实现动态吸底部的示例
2017/10/23 Javascript
分析JavaScript数组操作难点
2017/12/18 Javascript
nodejs结合Socket.IO实现的即时通讯功能详解
2018/01/12 NodeJs
vue toggle做一个点击切换class(实例讲解)
2018/03/13 Javascript
JavaScript中常见内置函数用法示例
2018/05/14 Javascript
详解写好JS条件语句的5条守则
2019/02/28 Javascript
原生js添加一个或多个类名的方法分析
2019/07/30 Javascript
使用p5.js临摹动态图片
2019/11/04 Javascript
Python开发WebService系列教程之REST,web.py,eurasia,Django
2014/06/30 Python
总结Python编程中函数的使用要点
2016/03/20 Python
对pandas的行列名更改与数据选择详解
2018/11/12 Python
Python面向对象之类和实例用法分析
2019/06/08 Python
PyCharm2020.1.1与Python3.7.7的安装教程图文详解
2020/08/07 Python
美国受欢迎的眼影品牌:BH Cosmetics
2016/10/25 全球购物
小米旗下精品生活电商平台:小米有品
2018/12/18 全球购物
JAVA和C++的区别
2013/10/06 面试题
装饰资料员岗位职责
2013/12/30 职场文书
如何写自我鉴定
2014/03/19 职场文书
落实八项规定专题民主生活会对照检查材料
2014/09/15 职场文书
2015年城管个人工作总结范文
2015/04/20 职场文书
《老人与海鸥》教学反思
2016/02/16 职场文书
springboot应用服务启动事件的监听实现
2022/04/06 Java/Android
Python使用Web框架Flask开发项目
2022/06/01 Python