getElementsByClassName兼容 封装
众所周知，JS获取DOM有个getElementsByClassName，非常方便，但是呢，为了兼容某些浏览器(你懂的)。只能 进行封装下了。解决方法如下
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>getElementsByClassName 封装</title>
</head> <body>
<div class="item">item1</div>
<div class="item">item2</div>
<div class="item">item3</div>
<div class="item">item4</div>
<div class="item">item5</div>
<div class="item">item6</div>
</body>
<script>
function getElementsByClassName(name, attrbuteName) {
var arr = [];
if (document.getElementsByClassName) {
// 如果支持这个属性，直接获取
arr = document.getElementsByClassName(name)
} else {
// 如果 不支持
var attr = attrbuteName ? attrbuteName : "*";///如果指定标签名称则用
var tagNameArr = document.getElementsByTagName(attr);
for (var index = ; index < tagNameArr.length; index++) {
var classNameArr = tagNameArr[index].className.split(" ")
for (var j = ; j < classNameArr.length; j++) {
if (classNameArr[j] === name) {
arr.push( tagNameArr[index])
} }
}
}
return arr;
}
getElementsByClassName("item","div")[].style.color = "red"
</script> </html>
getElementsByClassName兼容 封装的更多相关文章
- requestAnimationFrame 完美兼容封装
完美兼容封装: (function() { var lastTime = 0; var vendors = ['webkit', 'moz']; for(var x = 0; x < vendo ...
- getElementsByClassName - 兼容详细介绍
概述 JavaScript中getElementsByClassName()方法IE8及以下不支持.本文通过使用正则表达式实 现1个兼容方案. 本文内容分为3个部分. 浏览器原生getElements ...
- JS-特效 ～ 05. 缓动框架兼容封装／回掉函数／兼容透明度／层级、旋转轮播图、正则表达式、验证表单注册账号、
缓动函数中opcity 写百分值的值 JS一般不用小数运算,会照成精度丢失 元素的默*认透明度是 层级一次性赋值,不缓动 利用for…in为同一个父元素的子元素绑定属性 缓动框架兼容封装/回掉函数/ ...
- 兼容IE8以下，获取className节点的元素(document.getElementsByClassName()兼容写法)。
因为ie8一下不兼容 document.getElementsByClassName() 功能:通过class的名字获取符合条件的元素 ...
- 解决getElementsByClassName兼容问题
getElementsByClassName这个方法很常用,但是只有较新的浏览器才兼容,所以我们需要自己写个方法,解决这个问题,使它能够兼容各个浏览器. function getElementsByC ...
- 让getElementsByClassName兼容
function getElementsByClassName(node, classname){ if(node.getElementsByClassName){ //使用现有方法 return n ...
- javascript中document.getElementsByClassName兼容性封装方法一
var getElmsByClsName = function(className, results) { results = results || []; // 判断浏览器是否支持 getEleme ...
- getElementsByClassName兼容低版本浏览器
var getElementsByClassName = function (searchClass, node,tag) { if(document.getElementsByClassName){ ...
- 针对css3特性浏览器兼容 封装less
//--------------------------------------------------- // LESS Prefixer //--------------------------- ...
随机推荐
- 使用kafka-python客户端进行kafka kerberos认证
之前说过python confluent kafka客户端做kerberos认证的过程,如果使用kafka python客户端的话同样也可以进行kerberos的认证,具体的认证机制这里不再描述,主要 ...
- 【maven】maven下载依赖jar的源码
mvn dependency:sourcesmvn dependency:resolve -Dclassifier=javadoc 命令使用方法:首先进入到相应的pom.xml目录中,然后执行以上命令 ...
- Android Studio 3.4 修改 .android 和.gradle缺省目录-windows7x64专业版环境。
说明:缺省会在用户目录建立.android和.gradle目录.会挤满C盘.可以改变缺省目录. 改变.gradle目录路径示例,修改到D:\android目录,步骤: 1.建立d:\android目录 ...
- quartus仿真提示： Can't launch the ModelSim-Altera software
quartus仿真提示: Can't launch the ModelSim-Altera software 2017年07月13日 17:54:50 小怪_tan 阅读数:3255 路径中的结尾 ...
- [转]js对象中取属性值（.）和[ ]的区别
原文地址:https://www.jianshu.com/p/6a76530e4f8f 今天在写js的过程中遇到这么一个问题,取一个对象的属性值,通过obj.keys怎么都取不出来,但是用obj[ke ...
- Linux下SQL Server安装及数据库迁移
有客户使用Linux服务器,SQL Server从2017开始已支持Linux,从未用过,今天测试了一下,比较简单,记录一下. Linux:CentOS 7.0 首先更新源: curl -o /etc ...
- copy函数是有返回值的！
用 copy() 函数来删除开头的元素: a = []int{1, 2, 3} a = a[:copy(a, a[1:])] // 删除开头1个元素 a = a[:copy(a, a[N:])] // ...
- Angular8开发拼多多WebApp_汇总贴
https://coding.imooc.com/class/336.html?mc_marking=b9f5e475d0cb8922d899d416f5b4433f&mc_channel=s ...
- MongoDB开发深入之二：索引
索引分类: 默认索引 单一索引 复合索引 多键索引(数组索引) 全文检索索引 2dsphere 索引 2D索引 ...... 索引属性: 到期TTL 唯一索引 部分索引 稀疏索引 索引通常能够极大的提 ...
- 5中I/O模型
输入操作包括两个阶段1.等待网络数据到达,被复制到内核中的缓冲区2.从内核缓冲区复制到进程缓冲区5种I/O模型1.阻塞式I/O:包含数据被复制到内核缓冲区和应用进程缓冲区两个过程,调用recvfrom ...