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 相关文章推荐
基于jQuery的输入框无值自动显示指定数据的实现代码
Jan 24 Javascript
JavaScript中判断函数是new还是()调用的区别说明
Apr 07 Javascript
JavaScript实现的双向跨域插件分享
Jan 31 Javascript
使用Node.js为其他程序编写扩展的基本方法
Jun 23 Javascript
JS获取月份最后天数、最大天数与某日周数的方法
Dec 08 Javascript
js canvas实现擦除动画
Jul 16 Javascript
使用travis-ci如何持续部署node.js应用详解
Jul 30 Javascript
微信小程序methods中定义的方法互相调用的实例代码
Aug 07 Javascript
Vue指令之 v-cloak、v-text、v-html实例详解
Aug 08 Javascript
vue服务端渲染操作简单入门实例分析
Aug 28 Javascript
vue+spring boot实现校验码功能
May 27 Vue.js
关于antd tree 和父子组件之间的传值问题(react 总结)
Jun 02 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
2019年中国咖啡业现状与发展趋势
2021/03/04 咖啡文化
PHP与MySQL开发的8个技巧小结
2010/12/17 PHP
phpphp图片采集后按原路径保存图片示例
2014/02/18 PHP
PHP实现的比较完善的购物车类
2014/12/02 PHP
JavaScript 快捷键设置实现代码
2009/03/13 Javascript
JS 类型转换常见方法小结
2010/05/31 Javascript
体验js中splice()的强大(插入、删除或替换数组的元素)
2013/01/16 Javascript
谷歌浏览器调试JavaScript小技巧
2014/12/29 Javascript
js中数组结合字符串实现查找(屏蔽广告判断url等)
2016/03/30 Javascript
深入理解js函数的作用域与this指向
2016/05/28 Javascript
使用ajaxfileupload.js实现上传文件功能
2016/08/13 Javascript
详解js中Number()、parseInt()和parseFloat()的区别
2016/12/20 Javascript
js生成随机数方法和实例
2017/01/17 Javascript
nodejs个人博客开发第四步 数据模型
2017/04/12 NodeJs
基于angular实现模拟微信小程序swiper组件
2017/06/11 Javascript
vue自动化表单实例分析
2018/05/06 Javascript
微信小程序canvas.drawImage完全显示图片问题的解决
2018/11/30 Javascript
vue和better-scroll实现列表左右联动效果详解
2019/04/29 Javascript
深入学习TypeScript 、React、 Redux和Ant-Design的最佳实践
2019/06/17 Javascript
layui table表格数据的新增,修改,删除,查询,双击获取行数据方式
2019/11/14 Javascript
KnockoutJS数组比较算法实例详解
2019/11/25 Javascript
js实现网页版贪吃蛇游戏
2020/02/22 Javascript
vue+iview使用树形控件的具体使用
2020/11/02 Javascript
node中短信api实现验证码登录的示例代码
2021/01/20 Javascript
浅述python中argsort()函数的实例用法
2017/03/30 Python
python获取指定时间差的时间实例详解
2017/04/11 Python
Python字典及字典基本操作方法详解
2018/01/30 Python
pytorch:torch.mm()和torch.matmul()的使用
2019/12/27 Python
Sneaker Studio捷克:购买运动鞋
2018/07/08 全球购物
建筑实习自我鉴定
2013/10/18 职场文书
网络工程师职业规划
2014/02/10 职场文书
仓管员岗位责任制
2014/02/19 职场文书
购房委托书范本
2014/09/18 职场文书
员工辞职信怎么写
2015/02/27 职场文书
早恋主题班会
2015/08/14 职场文书
React如何使用axios请求数据并把数据渲染到组件
2022/08/05 Javascript