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. [Contest20180418]物理竞赛

    题意:在一个三维空间中有一个轴,轴上有一个垂直于轴的半径为$R$的凸透镜(光心在轴上)和$n$个点光源,假设每个点光源发出的$1$单位光都刚好覆盖凸透镜,现在有一个半径为$r$的圆形光屏,问光屏最多能 ...

  2. 【bzoj1087】【互不侵犯King】状压dp裸题(浅尝ACM-D)

    [pixiv] https://www.pixiv.net/member_illust.php?mode=medium&illust_id=54329606 向大(hei)佬(e)势力学(di ...

  3. [POI2014]Supercomputer

    题目大意: 给定一个$n(n\le10^6)$个结点的有根树,从根结点开始染色.每次可以染和已染色结点相邻的任意$k$个结点.$q(q\le10^6)$组询问,每次给定$k$,问至少需要染几次? 思路 ...

  4. eclipse无法导入Android工程的解决办法

    我以前在windows平台下写的android源代码无法通过import"existing project into workspace"导入到mac的eclipse中,直接搜不见 ...

  5. centos从头学习配置web服务器环境

    为了学习linux下配置web服务器环境,于是安装了vmware,准备在虚拟机里面学习web服务器的搭建! 首先是在虚拟机里安装centos,我选择的是32位的centos6.6版本,因为新版本7据说 ...

  6. 【Java】java注解@Transient的作用, 配合JPA中时间段的查询

    java注解@Transient的作用 @Transient标注的属性,不会被ORM框架映射到数据库中. 用于数据库表字段和java实体属性不一致的时候,标注在属性上使用. 例如时间段的查询 查询 R ...

  7. Hibernate中cascade和inverse的作用

    Inverse和cascade是Hibernate映射中最难掌握的两个属性.两者都在对象的关联操作中发挥作用.1.明确inverse和cascade的作用inverse 决定是否把对对象中集合的改动反 ...

  8. smarty在循环的时候计数来显示这是第几次循环的功能

    想必有很多人比较喜欢这个smarty循环的时候有个变量增加的功能或比较需要这个功能吧?其实不需要额外的变量,当然你也许根本用不了.我们用smarty内置的就可以了.就是smarty有foreach和s ...

  9. 高速排序java语言实现

    本博客不再更新,很多其它精彩内容请訪问我的独立博客 高速排序是非常重要的排序算法,可是我在学的时候发现网上没有特别好的样例所以自己动手写了一个. 自己动手丰衣足食. package sort; imp ...

  10. Linux——Virtualenv和pip小探

    转载自:http://mengzhuo.org/blog/virtualenv%E5%92%8Cpip%E5%B0%8F%E6%8E%A2.html 本文献给那些看着参差不齐的中文文档/教程,但还在坚 ...