关于IE中getElementsByClassName不能用的问题解决方法


Posted in Javascript onAugust 26, 2013

今天使用getElementsByClassName写了段小程序,满怀欣喜的准备去测试,在ff,谷歌等主流浏览器上测试都没问题,在IE9上也没问题,在IE6、8中测试的时候就出现问题了,浏览器报错。纠结了下代码,貌似没问题,果断找度娘。。。终于发现问题所在,然来是IE6、8中不支持getElementsByClassName这种方法。随后在网上搜索解决方法,找到了一个比较好的方法,是个老外写的一个方法,定睛一看居然是05年的问题了。。。先上代码:

* 
Developed by Robert Nyman, http://www.robertnyman.com 
Code/licensing: http://code.google.com/p/getelementsbyclassname/ 
*/ 
var getElementsByClassName = function (className, tag, elm){ 
if (document.getElementsByClassName) { 
getElementsByClassName = function (className, tag, elm) { 
elm = elm || document; 
var elements = elm.getElementsByClassName(className), 
nodeName = (tag)? new RegExp("\\b" + tag + "\\b", "i") : null, 
returnElements = [], 
current; 
for(var i=0, il=elements.length; i<il; i+=1){ 
current = elements[i]; 
if(!nodeName || nodeName.test(current.nodeName)) { 
returnElements.push(current); 
} 
} 
return returnElements; 
}; 
} 
else if (document.evaluate) { 
getElementsByClassName = function (className, tag, elm) { 
tag = tag || "*"; 
elm = elm || document; 
var classes = className.split(" "), 
classesToCheck = "", 
xhtmlNamespace = "http://www.w3.org/1999/xhtml", 
namespaceResolver = (document.documentElement.namespaceURI === xhtmlNamespace)? xhtmlNamespace : null, 
returnElements = [], 
elements, 
node; 
for(var j=0, jl=classes.length; j<jl; j+=1){ 
classesToCheck += "[contains(concat(' ', @class, ' '), ' " + classes[j] + " ')]"; 
} 
try { 
elements = document.evaluate(".//" + tag + classesToCheck, elm, namespaceResolver, 0, null); 
} 
catch (e) { 
elements = document.evaluate(".//" + tag + classesToCheck, elm, null, 0, null); 
} 
while ((node = elements.iterateNext())) { 
returnElements.push(node); 
} 
return returnElements; 
}; 
} 
else { 
getElementsByClassName = function (className, tag, elm) { 
tag = tag || "*"; 
elm = elm || document; 
var classes = className.split(" "), 
classesToCheck = [], 
elements = (tag === "*" && elm.all)? elm.all : elm.getElementsByTagName(tag), 
current, 
returnElements = [], 
match; 
for(var k=0, kl=classes.length; k<kl; k+=1){ 
classesToCheck.push(new RegExp("(^|\\s)" + classes[k] + "(\\s|$)")); 
} 
for(var l=0, ll=elements.length; l<ll; l+=1){ 
current = elements[l]; 
match = false; 
for(var m=0, ml=classesToCheck.length; m<ml; m+=1){ 
match = classesToCheck[m].test(current.className); 
if (!match) { 
break; 
} 
} 
if (match) { 
returnElements.push(current); 
} 
} 
return returnElements; 
}; 
} 
return getElementsByClassName(className, tag, elm); 
};

具体怎么使用可以去看他里面的使用方法。

使用这个方法之后,IE6、8中能显示了,但是还是有个随机的问题,有时刷新几次又会报错,暂时无解了。然后我想用jquery能不能解决这个刷新报错的问题,当然用jquery也能替代getElementsByClassName这个方法,具体怎么用这里就不作介绍了。然而事实终不能如人愿,刷新还是会有问题,而且报错是随机的,有时第一次加载过程中就报错,有时刷新几次才报错。大侠们。求解决。

Javascript 相关文章推荐
初学Javascript的一些总结
Nov 03 Javascript
javascript Excel操作知识点
Apr 24 Javascript
E3 tree 1.6在Firefox下显示问题的修复方法
Jan 30 Javascript
js获取本机操作系统类型的两种方法
Dec 19 Javascript
在JavaScript中调用Java类和接口的方法
Sep 07 Javascript
Bootstrap table学习笔记(2) 前后端分页模糊查询
May 18 Javascript
深入剖析Express cookie-parser中间件实现示例
Feb 01 Javascript
VUE v-model表单数据双向绑定完整示例
Jan 21 Javascript
实例讲解JS中pop使用方法
Jan 27 Javascript
vue+web端仿微信网页版聊天室功能
Apr 30 Javascript
《javascript设计模式》学习笔记一:Javascript面向对象程序设计对象成员的定义分析
Apr 07 Javascript
JavaScript类的继承多种实现方法
May 30 Javascript
关于Jquery操作Cookie取值错误的解决方法
Aug 26 #Javascript
jquery弹出框的用法示例(2)
Aug 26 #Javascript
jquery弹出框的用法示例(一)
Aug 26 #Javascript
jQuery快速上手:写jQuery与直接写JS的区别详细解析
Aug 26 #Javascript
使用js实现雪花飘落效果
Aug 26 #Javascript
JS预览图像将本地图片显示到浏览器上
Aug 25 #Javascript
点击弹出层外区域关闭弹出层jquery特效示例
Aug 25 #Javascript
You might like
PHP数字格式化
2006/12/06 PHP
php设计模式 Decorator(装饰模式)
2011/06/26 PHP
PHP基于ip2long实现IP转换整形
2020/12/11 PHP
基于JQuery的Select选择框的华丽变身
2011/08/23 Javascript
前台js调用后台方法示例
2013/12/02 Javascript
深入剖析JavaScript中的枚举功能
2014/03/06 Javascript
javascript中 try catch用法
2015/08/16 Javascript
AngularJS自定义控件实例详解
2016/12/13 Javascript
JS中利用localStorage防止页面动态添加数据刷新后数据丢失
2017/03/10 Javascript
实例分析nodejs模块xml2js解析xml过程中遇到的坑
2017/03/18 NodeJs
nodejs个人博客开发第三步 载入页面
2017/04/12 NodeJs
微信小程序获取用户openId的实现方法
2017/05/23 Javascript
jQuery事件blur()方法的使用实例讲解
2019/03/30 jQuery
vue 实现图片懒加载功能
2020/12/31 Vue.js
python中遍历文件的3个方法
2014/09/02 Python
你应该知道的python列表去重方法
2017/01/17 Python
Python实现的概率分布运算操作示例
2017/08/14 Python
Django 连接sql server数据库的方法
2018/06/30 Python
django celery redis使用具体实践
2019/04/08 Python
PYQT5实现控制台显示功能的方法
2019/06/25 Python
python:按行读入,排序然后输出的方法
2019/07/20 Python
基于多进程中APScheduler重复运行的解决方法
2019/07/22 Python
在pycharm中配置Anaconda以及pip源配置详解
2019/09/09 Python
使用Tkinter制作信息提示框
2020/02/18 Python
Python3之外部文件调用Django程序操作model等文件实现方式
2020/04/07 Python
新闻记者实习自我鉴定
2013/09/19 职场文书
党员的自我评价范文
2014/01/02 职场文书
大学生校园创业计划书
2014/02/08 职场文书
表彰会主持词
2014/03/26 职场文书
中国梦我的梦演讲稿
2014/04/23 职场文书
毕业设计答辩开场白
2015/05/29 职场文书
2019优秀干部竞聘演讲稿范文!
2019/07/02 职场文书
2019通用版劳动合同范本!
2019/07/11 职场文书
深入理解以DEBUG方式线程的底层运行原理
2021/06/21 Java/Android
Java集成swagger文档组件
2021/06/28 Java/Android
vue router 动态路由清除方式
2022/05/25 Vue.js