网页错误详细信息
消息: 对象不支持此属性或方法

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() 的方法的更多相关文章

  1. 解决 IE 不支持 document.getElementsByClassName() 的方法

    //create method getElementsByClassName for document if(!document.getElementsByClassName){ document.g ...

  2. 解决IE8下不支持document.getElementsByClassName的方法

    在代码前面加如下代码: if (!document.getElementsByClassName) { document.getElementsByClassName = function (clas ...

  3. WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务

    原文:WCF技术剖析之五:利用ASP.NET兼容模式创建支持会话(Session)的WCF服务 在<基于IIS的WCF服务寄宿(Hosting)实现揭秘>中,我们谈到在采用基于IIS(或者 ...

  4. 360或其他双核浏览器下在兼容模式用chrome内核渲染的方法

    <meta name="renderer" content="webkit"> <meta http-equiv="X-UA-COM ...

  5. document.getElementsByClassName() 原生方法 通过className 选择DOM节点

    <div id="box"> <div class="box">1</div> <div class="bo ...

  6. ie8及其以下浏览器的document.getElementsByClassName兼容性问题

    使用JavaScript访问DOM的一个重大问题是,此过程需要一种通过元素类名称来选择类的类函数,对DOMContentReady,这种类函数的缺失导致开发人员需要自己编写自定义脚本业执行上述任务,许 ...

  7. HTML5的兼容问题以及调用js文件的方法

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  8. meta 标签代码解决IE兼容问题,IE6,IE7,IE8,IE9,IE10(包括360的兼容模式)

    最近做了一个项目,客户反映,在360下布局错位,远程调试了一下,发现客户使用的是360的兼容模式,然而我在自己的电脑上测试的时候是正常的(兼容模式也正常):简单研究了一下360的兼容模式,在360的兼 ...

  9. [AJAX]ajax在兼容模式下失效解决办法

    使用jQuery,用ajax实现局部刷新功能,在火狐,360急速浏览器高速模式下,ie8,9都能正常运行,但切换到兼容模式下无效,解决办法有两种关闭浏览器兼容性视图,二是引入json2.js文件 这里 ...

随机推荐

  1. LocalStorage 的 具体操作 与 设置有效期

    读取与存储 的使用方法 //存储 (名称 , 内容 , 有效期<小时> ) // 如果想要自己改变 有效期的单位 可以在 set 方法中 // 找到 这两个 setHours getHou ...

  2. [代码审计]php弱类型总结

    0x01 前言 php是世界上最好的语言,所以php自身的安全问题也是web安全的一个方面.由于其自身弱类型语言的特性以及内置函数对于传入参数的松散处理,所以会带来很多的问题,这里将进行简要介绍. 弱 ...

  3. Bootstrap select多选下拉框实现代码

    前言 项目中要实现多选,就想到用插件,选择了bootstrap-select. 附上官网api链接,http://silviomoreto.github.io/bootstrap-select/. 没 ...

  4. 2018-2019-2 网络对抗技术 20165322 Exp7 网络欺诈防范

    2018-2019-2 网络对抗技术 20165322 Exp7 网络欺诈防范 目录 实验原理 实验内容与步骤 简单应用SET工具建立冒名网站 ettercap DNS spoof 结合应用两种技术, ...

  5. T-MAX组--项目冲刺(第五天)

    T-MAX组--项目冲刺(第五天) THE FIFTH DAY 项目相关 作业相关 具体描述 所属班级 2019秋福大软件工程实践Z班 作业要求 团队作业第五次-项目冲刺 作业正文 T-MAX组--项 ...

  6. [编码解码] 关于AES加解密中CBC模式的IV初始化向量的安全性问题

    copy from : https://www.jianshu.com/p/45848dd484a9 前段时间,在研究HLS的AES加密,由于一个地方电视台的HLS流有AES加密,在查看了相关的加解密 ...

  7. 根据udev的信息判断设备物理路径

    udev会生成by-path路径,根据这个就可以判断 dev目录下 [toybrick@localhost dev]$ find | grep platform-fe3c0000 ./disk/by- ...

  8. 文献阅读 | Molecular Architecture of the Mouse Nervous System

    文章亮点: 按level来管理和分析数据,文章有不同stage,每个stage有不同subtype,这应该是一个真tree,而不只是一个进化树,文章里出现最多的进化树把所有的stage都整合了. 空间 ...

  9. 001 安装mysql

    在安装docker之后,安装一个mysql的容器试试手.可以参考违章: URL: https://www.cnblogs.com/limingxie/p/8655457.html

  10. 小D课堂 - 零基础入门SpringBoot2.X到实战_第2节 SpringBoot接口Http协议开发实战_6、SpringBoot2.xHTTP请求配置讲解

    1.SpringBoot2.xHTTP请求配置讲解 简介:SpringBoot2.xHTTP请求注解讲解和简化注解配置技巧 1.@RestController and @RequestMapping是 ...