IE8以下版本没有getElementsByClassName这个方法,以下是兼容写法

function ieGetElementsByClassName() {
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;
};
}
}
ieGetElementsByClassName();

这个方法会在IE8浏览器的document上挂载getElementsByClassName方法,但是存在一个问题:

有一个已经获取到的元素,再通过类名获取子元素时会报错,比如

var idDom = document.getElementById(id)
idDom.getElementsByClassName(class) //idDom没有getElementsByClassName方法,会报错

解决办法:

function ieGetIdClass(id, classname) {
if (document.getElementsByClassName) {
if (id) {
var arrId = document.getElementById(id);
return arrId.getElementsByClassName(classname);
} else {
return document.getElementsByClassName(classname);
}
} else {
if (id) {
var arrId = document.getElementById(id);
var dom = arrId.getElementsByTagName("*");
var arr = [];
for (var i = 0; i < dom.length; i++) {
var txtArr = dom[i].className.split(" ");
for (var j = 0; j < txtArr.length; j++) {
if (txtArr[j] == classname) {
arr.push(dom[i]);
}
}
}
return arr;
}
}
} //用法
var doms = ieGetIdClass(id,class) //获取id元素下的所有class子元素

做学习用,开发中建议使用jQuery

IE8 兼容 getElementsByClassName的更多相关文章

  1. ie8兼容

    最近在做ie8兼容,把遇到的问题整理了一下 1. margin:0 auto; 无法居中 解决方法:1.换成h4的文档类型 <!DOCTYPE html PUBLIC "-//W3C/ ...

  2. 360兼容模式==ie8 兼容模式下 span标签占位问题

    ie8 兼容模式 ie8 标准渲染 应付金额 穿位 错误代码 <span class="span_em">应付金额:<em><span style=& ...

  3. IE8兼容placeholder的方案

    用JavaScript解决Placeholder的IE8兼容问题 placeholder属性是HTML5新添加的属性,当input或者textarea设置了该属性后,该值的内容将作为灰色提示显示在文本 ...

  4. ie8兼容圆角

    ie8兼容圆角 PIE.HTC下载地址:http://css3pie.com/ 兼容ie8 代码如下: <!DOCTYPE html> <html> <head> ...

  5. 使用X-UA-Compatible来设置IE8兼容模式

    使用X-UA-Compatible来设置IE8兼容模式 本文向大家描述一下如何使用X-UA-Compatible来设置IE8兼容模式,X-UA-Compatible是针对IE8兼容模式,X-UA-Co ...

  6. prototype.js的Ajax对IE8兼容问题解决方案

    你是否遇到过这样的问题?在使用protype.js的Ajax应用时,会出现这样的问题:只要调用了Ajax.Request,然后点该页面右键,查看“属性”就弹出“IE停止工作”的对话框,然后强制重新加载 ...

  7. javascript ie8兼容 a标签href javascript:void(0);

    ie8兼容 a标签href javascript:void(0); 尽量不要用javascript:协议做为A的href属性,这样不仅会导致不必要的触发window.onbeforeunload事件;

  8. react 开发 PC 端项目(一)项目环境搭建 及 处理 IE8 兼容问题

    步骤一:项目环境搭建 首先,你不应该使用 React v15 或更高版本.使用仍然支持 IE8 的 React v0.14 即可. 技术选型: 1.react@0.14 2.bootstrap3 3. ...

  9. H5C3--语义标签以及语义标签IE8兼容,表单元素新属性,度量器,自定义属性,dataList,网络监听,文件读取

    HTML5新增标签以及HTML5新增的api     1.H5并不是新的语言,而是html语言的第五次重大修改--版本     2.支持:所有的主流浏览器都支持h5.(chrome,firefox,s ...

随机推荐

  1. 在linux下给grep命令添加颜色

    1打开文件,添加如下一段话         vim ~/.bashrc           alias grep='grep --color'   2退出保存     source ~/.bashrc ...

  2. Mac如何通过远程控制其他Mac

    Mac如何通过远程控制其他Mac 发表于 2012 年 10 月 15 日 很多时候,我们会碰到需要被别人远程帮助或者远程帮助别人的情况,Windows下我们可以通过远程连接或者QQ远程协助来完成,但 ...

  3. hash算法散列算法

    Hash,一般翻译做“散列”,也有直接音译为“哈希”的,就是把任意长度的输入(又叫做预映射, pre-image),通过散列算法,变换成固定长度的输出,该输出就是散列值.这种转换是一种压缩映射,也就是 ...

  4. 咏南下拉列表数据敏感控件--TYNDBSearch

    咏南下拉列表数据敏感控件--TYNDBSearch 拥有下拉列表控件可以大大地加速软件系统的开发. 控件适用于DELPHI5及以上版本安装并使用. 控件的用法: procedure Tfgoods.s ...

  5. 设计模式之工厂模式之抽象工厂(php实现)

    github地址: git@github.com:ZQCard/design_pattern.git 抽象工厂模式: 先来认识下什么是产品族: 位于不同产品等级结构中,功能相关联的产品组成的家族.图中 ...

  6. 机器学习中的范数规则化之 L0、L1与L2范数

    http://blog.csdn.net/zouxy09/article/details/24971995/ L1正则化及其推导 Laplace(拉普拉斯)先验与L1正则化 今天我们聊聊机器学习中出现 ...

  7. Spring注释事务失效及解决办法

    如果带上事务,那么用annotation方式的事务注解和bean配置,事务会失效,要将service bean配置到xml文件中才行  在主容器中(applicationContext.xml),将C ...

  8. nginx静态资源配置

    解决EE工程中静态文件显示问题 在工程中本地测试没有问题,发现使用nginx配置了路径的页面,会获取不到相应页面的静态文件问题 静态文件的路径类似为: http://localhost:8080/sa ...

  9. 修改MySQL数据库存储位置datadir

    2017-04-14 1.找到mysql安装目录,默认是C:/ProgramData/MySQL/MySQL Server 5.1,找到my.ini.如果这个文件没有,自己建一个my.ini. 2.假 ...

  10. Java模式的秘密--java常用的几种模式

    要学习设计模式,首先要明白设计模式,就是为实现某一种或某一组功能提供的代码编码方式.它没有固定的套路,只有约定俗成的风格.所有编码者可以根据已有的设计模式开放思维,设计出自己的设计模式,也会在无意中使 ...