关于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 相关文章推荐
JS TextArea字符串长度限制代码集合
Oct 31 Javascript
JavaScript中数据结构与算法(三):链表
Jun 19 Javascript
举例说明JavaScript中的实例对象与原型对象
Mar 11 Javascript
解决jQuery ajax请求在IE6中莫名中断的问题
Jun 20 Javascript
BootStrap表单宽度设置方法
Mar 10 Javascript
vue的事件绑定与方法详解
Aug 16 Javascript
基于Vue实现可以拖拽的树形表格实例详解
Oct 18 Javascript
JavaScript实现的鼠标跟随特效示例【2则实例】
Dec 22 Javascript
原生js实现Flappy Bird小游戏
Dec 24 Javascript
玩转Koa之核心原理分析
Dec 29 Javascript
vue自定义组件(通过Vue.use()来使用)即install的用法说明
Aug 11 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+mysql不用递归实现的无限级分类实例(非递归)
2014/07/08 PHP
PHP中遇到的时区问题解决方法
2015/07/23 PHP
几种设置表单元素中文本输入框不可编辑的方法总结
2013/11/25 Javascript
js实现类似于add(1)(2)(3)调用方式的方法
2015/03/04 Javascript
使用Chrome浏览器调试AngularJS应用的方法
2015/06/18 Javascript
JS实现双击屏幕滚动效果代码
2015/10/28 Javascript
js实现点击每个li节点,都弹出其文本值及修改
2016/12/15 Javascript
利用Node.js+Koa框架实现前后端交互的方法
2017/02/27 Javascript
webpack下实现动态引入文件方法
2018/02/22 Javascript
基于vue打包后字体和图片资源失效问题的解决方法
2018/03/06 Javascript
解决axios发送post请求返回400状态码的问题
2018/08/11 Javascript
jQuery实现的记住帐号密码功能完整示例
2019/08/03 jQuery
通过vue写一个瀑布流插件代码实例
2019/09/07 Javascript
Openlayers实现距离面积测量
2020/09/28 Javascript
python3.3使用tkinter开发猜数字游戏示例
2014/03/14 Python
python有证书的加密解密实现方法
2014/11/19 Python
Python的MongoDB模块PyMongo操作方法集锦
2016/01/05 Python
python pandas库中DataFrame对行和列的操作实例讲解
2018/06/09 Python
Python寻找两个有序数组的中位数实例详解
2018/12/05 Python
pyinstaller打包opencv和numpy程序运行错误解决
2019/08/16 Python
python numpy 常用随机数的产生方法的实现
2019/08/21 Python
python ftplib模块使用代码实例
2019/12/31 Python
python和pywin32实现窗口查找、遍历和点击的示例代码
2020/04/01 Python
pytorch 中forward 的用法与解释说明
2021/02/26 Python
h5页面背景图很长要有滚动条滑动效果的实现
2021/01/27 HTML / CSS
澳大利亚排名第一的在线酒类商店:MyBottleShop
2018/04/26 全球购物
彪马日本官网:PUMA日本
2019/01/31 全球购物
外企办公室竞聘演讲稿
2013/12/29 职场文书
测量工程专业求职信
2014/02/24 职场文书
美容院店长岗位职责
2014/04/08 职场文书
工作汇报开头与结尾怎么写
2014/11/08 职场文书
2014年涉外离婚协议书范本
2014/11/20 职场文书
2014年卫生保健工作总结
2014/12/08 职场文书
千与千寻观后感
2015/06/04 职场文书
django注册用邮箱发送验证码的实现
2021/04/18 Python
服务器nginx权限被拒绝解决案例
2022/09/23 Servers