解决 IE 或者兼容模式不支持 document.getElementsByClassName() 的方法
网页错误详细信息
消息: 对象不支持此属性或方法
document.getElementsByClassName('element_name')
需要自己实现下该方法,因为ie5之前的版本并不支持这个方法
有以下四种方法,第四种兼容性最好
一、
//create method getElementsByClassName for 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;
};
}
二、
function getElementsByClassName(oElm, strTagName, strClassName){
var arrElements = (strTagName == "*" && oElm.all)? oElm.all :
oElm.getElementsByTagName(strTagName);
var arrReturnElements = new Array();
strClassName = strClassName.replace(/\-/g, "\\-");
var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
var oElement;
for(var i=0; i < arrElements.length; i++){
oElement = arrElements[i];
if(oRegExp.test(oElement.className)){
arrReturnElements.push(oElement);
}
}
return (arrReturnElements)
}
三、
var getElementsByClass = function(searchClass,node,tag) {
var classElements = new Array();
if ( node == null )
node = document;
if ( tag == null )
tag = '*';
var els = node.getElementsByTagName(tag);
var elsLen = els.length;
var pattern = new RegExp("(^|\\s)"+searchClass+"(\\s|$)");
for (i = 0, j = 0; i < elsLen; i++) {
if ( pattern.test(els[i].className) ) {
classElements[j] = els[i];
j++;
}
}
return classElements;
}
四、
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)
}
}
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;
}
}
原文地址:http://blog.csdn.net/u011483807/article/details/49177147
解决 IE 或者兼容模式不支持 document.getElementsByClassName() 的方法的更多相关文章
- 解决 IE 不支持 document.getElementsByClassName() 的方法
//create method getElementsByClassName for document if(!document.getElementsByClassName){ document.g ...
- 解决IE8下不支持document.getElementsByClassName的方法
在代码前面加如下代码: if (!document.getElementsByClassName) { document.getElementsByClassName = function (clas ...
- WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务
原文:WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务 在<基于IIS的WCF服务寄宿(Hosting)实现揭秘>中,我们谈到在采用基于IIS(或者 ...
- 360或其他双核浏览器下在兼容模式用chrome内核渲染的方法
<meta name="renderer" content="webkit"> <meta http-equiv="X-UA-COM ...
- document.getElementsByClassName() 原生方法 通过className 选择DOM节点
<div id="box"> <div class="box">1</div> <div class="bo ...
- ie8及其以下浏览器的document.getElementsByClassName兼容性问题
使用JavaScript访问DOM的一个重大问题是,此过程需要一种通过元素类名称来选择类的类函数,对DOMContentReady,这种类函数的缺失导致开发人员需要自己编写自定义脚本业执行上述任务,许 ...
- HTML5的兼容问题以及调用js文件的方法
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- meta 标签代码解决IE兼容问题,IE6,IE7,IE8,IE9,IE10(包括360的兼容模式)
最近做了一个项目,客户反映,在360下布局错位,远程调试了一下,发现客户使用的是360的兼容模式,然而我在自己的电脑上测试的时候是正常的(兼容模式也正常):简单研究了一下360的兼容模式,在360的兼 ...
- [AJAX]ajax在兼容模式下失效解决办法
使用jQuery,用ajax实现局部刷新功能,在火狐,360急速浏览器高速模式下,ie8,9都能正常运行,但切换到兼容模式下无效,解决办法有两种关闭浏览器兼容性视图,二是引入json2.js文件 这里 ...
随机推荐
- 【CSP模拟赛】益智游戏(最短路(DJSPFA)&拓扑排序)
题目描述 小P和小R在玩一款益智游戏.游戏在一个正权有向图上进行. 小P 控制的角色要从A 点走最短路到B 点,小R 控制的角色要从C 点走最短路到D 点. 一个玩家每回合可以有两种选择,移动到一个相 ...
- jquery 如何在js中间加入css?
) { $() + 'rem' }) } ) { $( + '%' }) }
- 怎么判断是qq浏览器还是uc浏览器?
这里我画红框的是不正确的,最好的办法就是打印出navigator.userAgent出来.uc浏览器检验是正确的.
- windows上hexo: command not found
使用hexo写博客已经有好几个月了,今天突然出现hexo: command not found,应该与我白天的时候调一下环境变量等有关.在对应的path添加环境变量,即可解决该问题.我的环境变量路径为 ...
- CENTOS7安装OPENSSL
CENTOS7安装OPENSSL yum install openssl yum install openssl-devel
- Nfs固定端口 nfs 端口公网映射
- Android studio: Android Studio 3.5格式化布局代码时错乱
Android studio 又来搞事情了,更新到3.5版本后,格式化布局文件代码时,布局文件代码竟然会发生变化,意思是不让格式化代码了呗? 垃圾的IDE. 解决办法: “File”-"Se ...
- Flutter -------- 加载本地图片资源和网络图片
在Flutter加载本地图片资源 在Flutter项目目录下创建文件夹 images ,在文件夹中添加几张图片 指定资源 pubspec.yaml文件中 version: 1.0.0+1 enviro ...
- linux内核中的电源管理接口
1. pm_runtime_enable/pm_runtime_disable 使能/禁止runtime PM,分别对dev->power.disable_depth执行++和--操作,这个变量 ...
- Kotlin集合——Map集合
Kotlin集合——Map集合 转 https://www.jianshu.com/p/da5cc9072f1e Kotlin的Map集合用于保存key-value对,其也被分为可变的和不可变的. 一 ...