兼容IE8以下，获取className节点的元素(document.getElementsByClassName()兼容写法)。
因为ie8一下不兼容
所以我们自己封装一个兼容IE8以下，获取className节点的函数。
//兼容IE8以下，获取className节点的元素。
function elementsByClassName(node, className){
var res = [];//定义一个数组用来存class相同的节点
//1、查找node所有的子节点
var nodes = node.getElementsByTagName("*");
/*node.getElementsByTagName("*") 的意思是通过标签名查找所以node节点下所有的节点*为通配符*/
for(var i = 0; i < nodes.length; i++){//遍历每一个节点
if(nodes[i].className == className){//判断每一个节点的class属性名是否等于 传入的class名
res.push(nodes[i]);
}
}
然后进行调用即可
window.onload = function(){
var oUl = document.getElementById('ul1')
var node = elementByClassName(oUl, 'box');
alert(node.length);//
}
html结构如下：
<body>
<ul id = 'ul1'>
<li class = 'box'>11111111</li>
<li>11111111</li>
<li>11111111</li>
<li class = 'box'>11111111</li>
</ul>
<ol>
<li>22222222</li>
<li class = 'box'>22222222</li>
<li>22222222</li>
</ol>
</body>
兼容IE8以下，获取className节点的元素(document.getElementsByClassName()兼容写法)。的更多相关文章
- webAPI(DOM) 2.1 获取页面元素 | 事件1 | 属性操作 | 节点 | 创建元素 | 事件2
js分三个部分: ECMAScript标准:js的基本语法 DOM:Ducument Object Model--->文档对象模型--->操作页面的元素 BOM:Browser Objec ...
- 获取元素节点的子节点 & 获取文本节点
1. 获取元素节点的子节点(**只有元素节点才有子节点): ①. childNodes 属性获取全部的子节点, 但该方法不实用. 因为如果要获取指定的节点 ...
- JS基础入门篇（ 三 ）—使用JS获取页面中某个元素的4种方法以及之间的差别（ 一 ）
1.使用JS获取页面中某个元素的4种方法 1.通过id名获取元素 document.getElementById("id名"); 2.通过class名获取元素 document.g ...
- 【转】让Bootstrap 3兼容IE8浏览器
FROM : http://www.ijophy.com/2014/05/bootstrap3-compatible-with-ie8.html 最近在研究Bootstrap(官方,Github)这个 ...
- 让Bootstrap 3兼容IE8浏览器
最近在研究Bootstrap(官方,Github)这个优秀的前端框架,Bootstrap最开始是Twitter团队内部的一个前端框架,所谓前端框架就是一个CSS/HTML框架,框架里面有下拉菜单.按钮 ...
- Bootstrap 3兼容IE8浏览器（转）
Bootstrap是一个响应式的布局,你可以在宽屏电脑.普通电脑,平板电脑,手机上都得到非常优秀的布局体验.这种响应式的布局正是通过CSS3的媒体查询(Media Query)功能实现的,根据不同的分 ...
- Bootstrap 3 兼容 IE8 浏览器
公司新上的项目,前端用的Bootstrap3的框架,但它已经放弃对IE9下的支持了.可IE8还是有着许多用户,不能不照顾到他们,IE7以下的,我只想说,现在什么年代了,要解放思想,与时俱进啊,就不能动 ...
- js插件实现点击复制内容到粘贴板，兼容IE8
先来看下本次需要导入的文件: 第一个是jquery.js,这个不多说: 第二个是jquery.zclip.js,第三个是zeroClipboard.swf ,这两个文件的下载链接:http://www ...
- getElementsByClassName - 兼容详细介绍
概述 JavaScript中getElementsByClassName()方法IE8及以下不支持.本文通过使用正则表达式实 现1个兼容方案. 本文内容分为3个部分. 浏览器原生getElements ...
随机推荐
- Java_myBatis_逆向工程
所谓逆向工程,就是根据数据库自动生成项目工程(包括了Interface.POJO.映射文件xml) 逆向工程包:https://github.com/wcyong/mybatisGeneratorCu ...
- JavaScript模板代码总结
//中文input框对非中文的校验 var reg=/[^\u4E00-\u9FA5]/g; if (reg.test($("#jgqc").val())){ alert(&quo ...
- H3C配置FTP服务器
H3C配置FTP服务器 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.FTP协议简介 1.FTP协议是互联网上广泛使用的文件传输协议 FTP文件传送协议(File Transf ...
- Port Forwarding in Windows
转自:http://woshub.com/port-forwarding-in-windows/ Since Windows XP there is a built-in ability in Mic ...
- centos6.5环境下安装zk
第一步:先下载安装包,解压. 第二步:进去根目录,创建data文件夹 mkdir data 第三步:进去conf文件夹,修改 zoo_sample.cfg 的名字 mv zoo_sam ...
- sublime 将打字内容放在屏幕中央
在settings user里添加一句: "scroll_past_end": true
- VS中修改工程名的解决方案
VS中修改工程名的解决方案: 一.先修改工程名/解决方案名(在VS中修改即可)举例,原先的工程名为OldProject 想要改成NewProject1.找到工程/解决方案所在的文件夹(已工程名/解 ...
- Python GUI工具Tkinter以及拖拉工具Page安装
如果使用Tkinter作为Python GUI工具,我们需要安装Tkinter,这个使用conda或者pip即可: conda install -c anaconda tk 为了提高界面编写效率,可以 ...
- HTML5的学习（二）HTML5标签
3.按功能排列标签 (注:红色为HTML5不支持的,蓝色为HTML5新增的标签元素.) 3.1基本 标签 描述 HTML4 HTML5 <!--...--> 定义注释. √ √ < ...
- Java打印M图形(二维数组)——（九）
对于平面图形输出集合图形与数字组合的,用二维数组.先在Excel表格中分析一下,找到简单的规律.二维数组的行数为行高,列数为最后一个数大小. 对于减小再增大再减小再增大的,可以用一个boolean标志 ...