IE不支持getElementsByClassName最终完美解决方案


Posted in Javascript onDecember 17, 2012

目前可以这么解决,判断浏览器支不支持这个方法,如果支持就不管;如果不支持,就在document对象里加入getElementsByClassName这个方法,这样的写法有一个好处,即不管有没有原生函数你都不用去修改代码。

通常先使用getElementsByTagName("*")取出文档中所有元素,然后进行遍历,使用正则表达式找出匹配的元素放入一个数组返回。由于IE5不支持document.getElementsByTagName("*"),要使用分支document.all以防错误

下面的方法完美支持了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; 
}; 
}

最终的方案为: 
var getElementsByClassName = function (searchClass, node,tag) { 
if(document.getElementsByClassName){ 
var nodes = (node || document).getElementsByClassName(searchClass),result = []; 
for(var i=0 ;node = nodes[i++];){ 
if(tag !== "*" && node.tagName === tag.toUpperCase()){ 
result.push(node) 
}else{ 
result.push(node) 
} 
} 
return result 
}else{ 
node = node || document; 
tag = tag || "*"; 
var classes = searchClass.split(" "), 
elements = (tag === "*" && node.all)? node.all : node.getElementsByTagName(tag), 
patterns = [], 
current, 
match; 
var i = classes.length; 
while(--i >= 0){ 
patterns.push(new RegExp("(^|\s)" + classes[i] + "(\s|$)")); 
} 
var j = elements.length; 
while(--j >= 0){ 
current = elements[j]; 
match = false; 
for(var k=0, kl=patterns.length; k<kl; k++){ 
match = patterns[k].test(current.className); 
if (!match) break; 
} 
if (match) result.push(current); 
} 
return result; 
} 
}
Javascript 相关文章推荐
jquery动态加载图片数据练习代码
Aug 04 Javascript
javascript 模拟坦克大战游戏(html5版)附源码下载
Apr 08 Javascript
wap浏览自动跳转到wap页面的js代码
May 17 Javascript
jQuery CSS()方法改变现有的CSS样式表
Sep 09 Javascript
Javascript中Array.prototype.map()详解
Oct 22 Javascript
jQuery控制网页打印指定区域的方法
Apr 07 Javascript
简单理解vue中el、template、replace元素
Oct 27 Javascript
Angular.js中$resource高大上的数据交互详解
Jul 30 Javascript
利用js-cookie实现前端设置缓存数据定时失效
Jun 18 Javascript
Vue中watch、computed、updated三者的区别及用法
Jul 27 Javascript
详解JavaScript中的链式调用
Nov 27 Javascript
详解JavaScript中的执行上下文及调用堆栈
Apr 29 Javascript
jQuery移动和复制dom节点实用DOM操作案例
Dec 17 #Javascript
javascript中判断一个值是否在数组中并没有直接使用
Dec 17 #Javascript
firefox下jquery iframe刷新页面提示会导致重复之前动作
Dec 17 #Javascript
使用按钮控制以何种方式打开新窗口的属性介绍
Dec 17 #Javascript
如何让页面在打开时自动刷新一次让图片全部显示
Dec 17 #Javascript
js中escape对应的C#解码函数 UrlDecode
Dec 16 #Javascript
Ext JS 4官方文档之三 -- 类体系概述与实践
Dec 16 #Javascript
You might like
检测png图片是否完整的php代码
2010/09/06 PHP
PHP中防止SQL注入实现代码
2011/02/19 PHP
解析二进制流接口应用实例 pack、unpack、ord 函数使用方法
2013/06/18 PHP
php实现两表合并成新表并且有序排列的方法
2014/12/05 PHP
javascript DOM编程实例(智播客学习)
2009/11/23 Javascript
JS 跳转页面延迟2种方法
2013/03/29 Javascript
复制js对象方法(详解)
2013/07/08 Javascript
extjs中form与grid交互数据(record)的方法
2013/08/29 Javascript
Jquery判断radio、selelct、checkbox是否选中及获取选中值方法总结
2015/04/15 Javascript
JS+CSS实现的竖向简洁折叠菜单效果代码
2015/10/22 Javascript
js数组常见操作及数组与字符串相互转化实例详解
2015/11/10 Javascript
Bootstrap Paginator分页插件与ajax相结合实现动态无刷新分页效果
2016/05/27 Javascript
javascript设计模式之单体模式学习笔记
2017/02/15 Javascript
javascript数组去重常用方法实例分析
2017/04/11 Javascript
JS匹配日期和时间的正则表达式示例
2017/05/12 Javascript
Jquery把获取到的input值转换成json
2017/05/15 jQuery
bootstrap treeview 扩展addNode方法动态添加子节点的方法
2017/11/21 Javascript
Bootstrap 中data-[*] 属性的整理
2018/03/13 Javascript
jQuery中可见性过滤器简单用法示例
2018/03/31 jQuery
Vue项目使用CDN优化首屏加载问题
2018/04/01 Javascript
vue实现前端分页完整代码
2020/06/17 Javascript
jQuery实现可以计算进制转换的计算器
2020/10/19 jQuery
[01:07:21]NAVI vs VG Supermajor 败者组 BO3 第二场 6.5
2018/06/06 DOTA
python从ftp下载数据保存实例
2013/11/20 Python
简单谈谈python中的语句和语法
2017/08/10 Python
将字典转换为DataFrame并进行频次统计的方法
2018/04/08 Python
python3爬虫中多线程的优势总结
2020/11/24 Python
HTML5拖拽功能实现的拼图游戏
2018/07/31 HTML / CSS
super()与this()的区别
2016/01/17 面试题
助人为乐表扬信范文
2014/01/14 职场文书
幼儿园六一儿童节文艺汇演主持词
2014/03/21 职场文书
电台广播稿范文
2015/08/19 职场文书
班委竞选稿范文
2015/11/21 职场文书
小学英语教学反思范文
2016/02/15 职场文书
2019年英语版感谢信(8篇)
2019/09/29 职场文书
搞笑Gif:这么白这么长的腿像极了一楼的女朋友
2022/03/21 杂记