js通过class获取元素时的兼容性解决方案
1:::::方法代码如下:
function getByClass(sClass){
var aResult=[];
var aEle=document.getElementsByTagName('*');
for(var i=0;i<aEle.length;i++){
/*当className相等时添加到数组中*/
if(aEle[i].className==sClass){
aResult.push(aEle[i]);
}
}
return aResult;
};
调用方法(实际使用):
window.onload=function (){
var aBox=getByClass("box");
for(var i=0;i<aBox.length;i++){
alert(aBox[i].innerHTML);
}
};
----------------------------------------------------------------------
2::::::::::::::::::;如<div class="box aa bb"></div>,我们可以将class通过空格拆分成数组,如果要获取的class满足数组中的一个元素,那么就获得此元素。
方法代码如下:
function getByClass(oParent,sClass){//oParent获取类的父元素
var aResult=[];
var aEle=oParent.getElementsByTagName('*');
for(var i=0;i<aEle.length;i++){
/*将每个className拆分*/
var arr=aEle[i].className.split(/\s+/);
for(var j=0;j<arr.length;j++){
/*判断拆分后的数组中有没有满足的class*/
if(arr[j]==sClass){
aResult.push(aEle[i]);
}
}
}
return aResult;
};
js通过class获取元素时的兼容性解决方案的更多相关文章
- 原生JS与JQ获取元素的区别
刚学JQ不久,有时候可能会把JS和JQ获取元素的方式搞错,接下来获取属性方法什么的就一发不可收拾了,现在把两者获取获取元素的代码整理下. 一.原生JS获取元素. 1.常用的三种方式获取元素对象(将指定 ...
- js中获取元素的样式兼容性的写法
1:设计元素的样式:el.style.color="red"||el.style["color"]="red" 获取元素的样式:el.st ...
- vue / js使用video获取视频时长
项目中遇到上传视频功能,需要有预览和获取视频时长功能,因之前使用upload(有需要的话可以参考下我之前的文章),这里就不赘述,直接用来上传视频,不过在上传之前和上传成功后的钩子里,获取不到时长: 没 ...
- 原生js来写获取元素距离顶部距离,以及滚动条滚动指定距离和时间控制
这是我在写vue项目里封装的一个公共js类 里面还有一些其他的方法,一并拿过来了 class Public { isDesktop(){ //判断是否为pc端 return (window.scree ...
- js通过class获取元素
<!doctype html> <html> <head> <meta charset="utf-8"> <meta char ...
- JS——通过标签获取元素、循环语句、数组去重
通过标签获取元素: var aLi = document.getElementsByTagName('Li'); aLi[0].style.backgroundColor = 'gold'; 选中部分 ...
- name值与id值在Js获取元素时的区别
1.适用范围 除base.head.html.script.meta.title标签外,id都可以用:name只适用于select.form.frame.iframe.img.a.input等中. H ...
- 使用jquery日期选择器flatpickr.js,使用js动态创建input元素时插件失效
最近写页面时需要用到,日期选择器,网上搜索了一些插件,最后使用了flatpickr.js.我是从npm 上拉下的依赖 npm install flatpickr --save 随后在页面中引入css ...
- js动画之获取元素属性
首先我们要介绍一些知识 offsetWidth element.offsetWidth = width + padding + border; width 我们也知道element.style.wid ...
随机推荐
- JS实现键盘监听
不说废话直接上正文: <html> <head> <meta http-equiv="Content-Type" content="text ...
- c++ --> #define中的三个特殊符号:#,##,#@
#define中的三个特殊符号:#,##,#@ 看下面三个define宏定义: #define Conn(x,y) x##y #define ToChar(x) #@x #define ToStrin ...
- c++ --> static关键字总结
static关键字总结 C++的static有两种用法:面向过程程序设计中的static和面向对象程序设计中的static.前者应用于普通变量和函数,不涉及类:后者主要说明static在类中的作用. ...
- centos-6.7 内核升级(转)
本文转自http://www.linuser.com/thread-1622-1-1.html 默认centos-6.7 自带的内核版本: [root@testserver ~ ::]#uname - ...
- 推荐一个利用 python 生成 pptx 分析报告的工具包:reportgen
reportgen v0.1.8 更新介绍 这段时间,我对 reportgen 进行了大工程量的修改和更新.将之前在各个文章中出现的函数进行了封装,同时也对现有工具包的一些逻辑进行了调整. 1.rep ...
- 根据IO流源码深入理解装饰设计模式使用
一:摘要 通过对java的IO类中我们可以得出:IO源码中使用装饰设计模式频率非常高, 对装饰设计模式而言,他能够避免继承体系的臃肿,同时也可以动态的给一个对象添加一些额外的功能,如果要扩展一个功能, ...
- Transaction 事务简单详解
Transaction 也就是所谓的事务了,通俗理解就是一件事情.从小,父母就教育我们,做事情要有始有终,不能半途而废. 事务也是这样,不能做一半就不做了,要么做完,要么就不做.也就是说,事务必须是一 ...
- 《团队-OldNote-项目总结》
我们小组做的是手机便签的app---OldNote 最开始我们想解决普通手机便签无法进行语音和照片的备忘这一问题,但是由于没有做过拍照和录音的经验怕由于技术原因无法达成目的,就没敢写在需求分析中.当完 ...
- 每日冲刺报告——Day1(Java-Team)
第一天报告(11.2 周四) 团队:Java-Team 成员: 章辉宇(284) 吴政楠(286) 陈阳(PM:288) 韩华颂(142) 胡志权(143) github地址:https://git ...
- .NET Core装饰模式和.NET Core的Stream
该文章综合了几本书的内容. 某咖啡店项目的解决方案 某咖啡店供应咖啡, 客户买咖啡的时候可以添加若干调味料, 最后要求算出总价钱. Beverage是所有咖啡饮料的抽象类, 里面的cost方法是抽象的 ...