兼容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 ...
随机推荐
- js对象之window和document区别
window是整个页面的全局环境,而document可以理解为整个页面这个最大的元素(整个dom树) window: 可以看到window下面有很多变量 document: 可见document是整个 ...
- 关于连接linux被拒
一.scp被拒 在服务器A命令行使用scp往服务器B传输,如: scp -i id_rsa_125 file1 user01@IP:/home #ssh_exchange_identification ...
- 第一模块：python基础语法
Python基础[day01]:python介绍发展史(一) Python基础[day01]:Hello World程序(二) Python基础[day01]:表达式if ...else语句(三) P ...
- ACPI:Memory错误解决办法
Linux系统装在vmware12中,打开虚拟机时报错,报错内容大概如下: ACPI:memory_hp:Memory online failed for 0x100000000 - 0x400000 ...
- Spark记录-阿里巴巴开源工具DataX数据同步工具使用
1.官网下载 下载地址:https://github.com/alibaba/DataX DataX 是阿里巴巴集团内被广泛使用的离线数据同步工具/平台,实现包括 MySQL.Oracle.SqlSe ...
- CodeChef - CRYPCUR
题目链接 AMRExchange is the latest cryptocurrency exchange that has become very popular among cryptocurr ...
- Python基础(函数部分)-day04
写在前面 上课第四天,打卡: 加勒比海盗今天上映:端午节公司发的粽子很有范! 一.函数的基本概念 - 函数是什么? 函数,就是一个'锤子',一个具有特定功能的'锤子',使用者可以在适当的时候使用这个 ...
- 正方体旋转demo
接着上一篇博客的内容顺藤摸瓜往下想,既然stage有景深这个概念,可以表达3D场景,那么这个stage就可以呈现立体几何咯,于是自己写了个Cubic Demo 一个正方体有6个面,我们把一个正方体平铺 ...
- 一个简单的"RPC框架"代码分析
0,服务接口定义---Echo.java /* * 定义了服务器提供的服务类型 */ public interface Echo { public String echo(String string) ...
- Jacob用法收集
介绍 Jacob 是Java-COM Bridge的缩写,它在Java与微软的COM组件之间构建一座桥梁.使用Jacob自带的DLL动态链接库,并通过JNI的方式实现了在Java平台上对COM程序的调 ...