关于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的eval()中使用函数的进一步讨论
Jul 26 Javascript
JavaScript的类型转换(字符转数字 数字转字符)
Aug 30 Javascript
jquery中通过过滤器获取表单元素的实现代码
Jul 05 Javascript
Javascript实现简单二级下拉菜单实例
Jun 15 Javascript
jquery实现鼠标滑过显示提示框的方法
Feb 05 Javascript
JS仿hao123导航页面图片轮播效果
Sep 01 Javascript
jQuery实现radio第一次点击选中第二次点击取消功能
May 15 jQuery
详解webpack进阶之插件篇
Jul 06 Javascript
微信小程序实现长按删除图片的示例
May 18 Javascript
jQuery Ajax async=&gt;false异步改为同步时,解决导致浏览器假死的问题
Jul 22 jQuery
jquery选择器和属性对象的操作实例分析
Jan 10 jQuery
Vue切换div显示隐藏,多选,单选代码解析
Jul 14 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多种序列化与反序列化的方法
2013/06/06 PHP
解析ajax事件的调用顺序
2013/06/17 PHP
PHP获取当前日期和时间及格式化方法参数
2015/05/11 PHP
WampServer搭建php环境时遇到的问题汇总
2015/07/23 PHP
PHP中使用mpdf 导出PDF文件的实现方法
2018/10/22 PHP
PHP连接及操作PostgreSQL数据库的方法详解
2019/01/30 PHP
jquerymobile checkbox及时刷新才能获取其准确值
2012/04/14 Javascript
基于jquery的bankInput银行卡账号格式化
2012/08/22 Javascript
使用纯javascript实现经典扫雷游戏
2015/04/23 Javascript
Node.js配合node-http-proxy解决本地开发ajax跨域问题
2016/08/31 Javascript
validationEngine 表单验证插件使用实例代码
2017/06/15 Javascript
详解webpack babel的配置
2018/01/09 Javascript
JS手写一个自定义Promise操作示例
2020/03/16 Javascript
Vue通过getAction的finally来最大程度避免影响主数据呈现问题
2020/04/24 Javascript
微信小程序学习总结(一)项目创建与目录结构分析
2020/06/04 Javascript
vue切换菜单取消未完成接口请求的案例
2020/11/13 Javascript
javascript实现点击小图显示大图
2020/11/29 Javascript
[06:53]DOTA2每周TOP10 精彩击杀集锦vol.3
2014/06/25 DOTA
[00:14]PWL:老朋友Mushi拍VLOG与中国玩家问好
2020/11/04 DOTA
python实现根据ip地址反向查找主机名称的方法
2015/04/29 Python
Python使用Mechanize模块编写爬虫的要点解析
2016/03/31 Python
Python中is与==判断的区别
2017/03/28 Python
Python3获取电脑IP、主机名、Mac地址的方法示例
2019/04/11 Python
Python range与enumerate函数区别解析
2020/02/28 Python
html5 canvas-2.用canvas制作一个猜字母的小游戏
2013/01/07 HTML / CSS
Canvas 帧动画吃苹果小游戏
2020/08/05 HTML / CSS
瑞典快乐袜子:Happy Socks
2018/02/16 全球购物
Nike加拿大官网:Nike.com (CA)
2019/04/09 全球购物
计算机应用专业学生的自我评价分享
2013/11/03 职场文书
《晚上的太阳》教学反思
2014/04/23 职场文书
安全目标责任书
2014/07/22 职场文书
三分钟自我介绍演讲稿
2014/08/21 职场文书
婚宴致辞
2015/07/28 职场文书
劳务派遣管理制度(样本)
2019/08/23 职场文书
MySQL 使用索引扫描进行排序
2021/06/20 MySQL
教你nginx跳转配置的四种方式
2022/07/07 Servers