[JavaScript]兼容IE6/7的getElementByClassName

这篇博客探讨了在JavaScript中使用getElementByClassName方法时遇到的浏览器兼容性问题,特别是针对Firefox和IE6/7。文章指出,虽然Firefox支持此方法,但IE不支持。通常,开发者会依赖于框架提供的兼容解决方案。文中还分享了一种通过检测document.all来区分IE和非IE浏览器的技巧,以实现兼容性的解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

在使用原生javascript时,获取类选择符时,即使用getElementByClassName,它在Firefox和IE下是不能兼容。

Firefox下是可以用它获取的到元素而IE不行,一般框架都会实现该方法,达到在IE和Firefox下兼容的问题。


function getByClassName(className){  
			if(document.getElementByClassName){  
				return document.getElementByClassName(className) //FF下因为有此方法,所以可以直接获取到;  
			}  
			var nodes=document.getElementsByTagName("*");//获取页面里所有元素,因为他会匹配全页面元素,所以性能上有缺陷,但是可以约束他的搜索范围;  
			var arr=[];//用来保存符合的className;  
			for(var i=0;i<nodes.length;i++){  
				if(hasClass(nodes[i],className)) arr.push(nodes[i]);  
			}  
			return arr;  
		} 


function hasClass(node,className){  
			var cNames=node.className.split(/\s+/);//根据空格来分割node里的元素;  
			for(var i=0;i<cNames.length;i++){  
				if(cNames[i]==className) return true;  
			}  
			return false;  
		} 

另从网上看到一种解决的办法:


由于IE4之后对 document.all 都有支持,所以可以简单的利用是否支持 document.all判断是否为IE。

如果不是IE,则用W3C DOM的document.getElementByTagName('*')取代all

function getElementsByClassName (className) {
			var all = document.all ? document.all : document.getElementsByTagName('*');
			var elements = new Array();
			for (var e = 0; e < all.length; e++) {
				if (all[e].className == className) {
					elements[elements.length] = all[e];
					break;
				}
			}
			return elements;
		} 


参考:http://www.cnblogs.com/oomusou/archive/2008/05/19/1202296.html
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值