javascript getElementsByClassName扩展函数
代码:
function getElementsByClassName(){
if(!arguments[0]){return []};//未指定任何参数,直接返回
var args=arguments,
a=args[0],//要查找的样式名称
b=typeof(args[1])=='string' && args[1]||'*',//指定的标签
c=((typeof(args[1])!='string' && args[1]) || args[2])||document,//在指定的容器内查找
d=a.split(' '),//样式名称列表
e=d.length,//待查找的样式总数
f=e>1,//是否查找多个样式
g={},//存储所有样式:for IE
h=[];//最终对象存储
if(f){
for(var i=0;i<e;i++){
g[d[i]]=!0;
}
}else{
g[a]=!0;
};
if(document.all || (!document.all && f)){
var o=c.getElementsByTagName(b);
for(var i=0;i<o.length;i++){
if(g[o[i].className]){
h.push(o[i]);
}
}
}else{
h=c.getElementsByClassName(a);//非IE标准浏览器:为保证元素的原有索引,仅在指定查找一个样式时使用此方法
};
return h;
};
用法:
三个参数:
1:待查找的样式,可指定多个,用空格分隔;未指定时直接返回
2:[可选项]可指定查找的特定标签,默认为:遍历所有标签*
3:[可选项]指定父容器,默认为:document
可跳过第2个参数直接指定第3个参数。
测试DOM:
<div class="c">我在id=parent的层以外</div>
<div id="parent">
<div class="c">1</div>
<div class="c">2</div>
<div class="c">3</div>
<div class="c">4</div>
<div class="c">5</div>
<div class="b">56</div>
<div class="b">78</div>
<span class="c">9</span>
</div>
//下面调用,仅返回parent内部,div的样式符合条件的元素
var o=getElementsByClassName("c b",'div',document.getElementById('parent'));
for(var i=0;i<o.length;i++){
alert(o[i].innerHTML)
};
//下面调用,返回div的样式符合条件的元素
var o=getElementsByClassName("c b",'div');
for(var i=0;i<o.length;i++){
alert(o[i].innerHTML)
};
//下面调用,仅返回parent内部,所有样式符合条件的元素
var o=getElementsByClassName("c b",document.getElementById('parent'));
for(var i=0;i<o.length;i++){
alert(o[i].innerHTML)
};
//下面调用,返回所有样式符合条件的元素
var o=getElementsByClassName("c b");
for(var i=0;i<o.length;i++){
alert(o[i].innerHTML)
};
javascript getElementsByClassName扩展函数的更多相关文章
- Javascript:getElementsByClassName
背景: 由于原生的getElementsByClassName不支持在指定标签中查找指定元素为指定class的情况,所以,这里舍弃了原生的方法调用 方法一: function getElement ...
- [ javascript ] getElementsByClassName与className和getAttribute!
对于javascript中的getElementsByClassName 在IE 6/7/8 不支持问题. 那么须要模拟出getElementsByClassName 须要採用className属性 ...
- (转载)怎么写tab?
演示地址:http://www.adanghome.com/js_demo/3/ =========================================================== ...
- RobotFramework测试问题二:各种元素不能定位问题
各种元素不能定位问题 一.元素定位 A. Click Element + xpath B. Click Element + contains C. Execute Javascript + getEl ...
- 深入理解javascript选择器API系列第二篇——getElementsByClassName
× 目录 [1]使用 [2]classList [3]扩展 前面的话 既然有getElementById()和getElementsByTagName()方法,为什么没有getElementsByCl ...
- 整理一些JavaScript时间处理扩展函数
在JavaScript中,时间处理是经常需要用到的.最近想要慢慢建立自己的代码库,整理了几个之前用到的js处理时间的函数,发出来跟大家分享一下,以后的使用中会不断增加和修改代码库. 把字符串转换为日期 ...
- 【JavaScript兼容】关于IE8及以下无法通过getElementsByClassName()方法获得元素的解决方法
try{ var a = document.getElementsByClassName("cla"); console.log(a); }catch(ex){ var array ...
- javascript解决getElementById()的bug以及getElementsByClassName的兼容性写法
<a name="target" href="#">链接</a> <p id="target">文字说明 ...
- 一个JavaScript日期格式化扩展函数
我们都知道在Java和PHP语言中,有专门用于格式化日期对象的类和函数,例如Java中的DateFormat等等,通过这些类和函数,我们可以方便的将一个日期对象按照格式的要求输出为字符串,例如对于同一 ...
随机推荐
- 编译一个支持django及mysqlclient连接的alpine镜像
一切都不难,难的就是在alpine镜像里. 最后,使用了网上编译好mysqlclient的镜像,才搞定. 记录一下. 一,基础镜像Dockerfile https://github.com/tnir/ ...
- 201871010133 赵永军《面向对象程序设计(java)》第六、七周学习总结
201871010133 赵永军<面向对象程序设计(java)>第六.七周学习总结 项目 内容 这个作业属于哪个课程 https://www.cnblogs.com/nwnu-daizh/ ...
- Lambda 表达式应用 权限管理_用户的角色修改
Lambda 表达式应用 权限管理_用户的角色修改 需求 前台发送用户新的角色列表,后台查询出用户原有的角色列表. 1.获取出需增加的角色列表 => 在新角色列表中,但是不在原角色列表中的角色 ...
- 柯里化currying + 隐式调用 = 一个有名的add面试题
柯里化 =================================== 维基百科解释: 柯里化,英语:Currying(果然是满满的英译中的既视感),是把接受多个参数的函数变换成接受一个单一参 ...
- Python前言之Markdown使用
一.Markdown基本语法 1.1标题 代码: # 一级标题 ## 二级标题 ### 三级标题 #### 四级标题 ##### 五级标题 ###### 六级标题 效果: 一级标题 二级标题 三级标题 ...
- USACO Apple Delivery
洛谷 P3003 [USACO10DEC]苹果交货Apple Delivery 洛谷传送门 JDOJ 2717: USACO 2010 Dec Silver 1.Apple Delivery JDOJ ...
- 【oracle】ORA-12638 : 身份证明检索失败
sqlnet.ora 1.删了 2.#注释了 背后缘由:待写
- cnpm包管理
C:\Users\Administrator>npm config set registry http://registry.npm.taobao.org vue 安装 npm install ...
- STL——sort函数的实现原理
实现原理 sort结合了快速排序.堆排序.直接插入排序三种排序方法. 根据不同的数量级别以及不同情况,能自动选用合适的排序方法.当数据量较大时采用快速排序,分段递归.一旦分段后的数据量小于某个阀值,为 ...
- 【转】机器学习实战之K-Means算法
一,引言 先说个K-means算法很高大上的用处,来开始新的算法学习.我们都知道每一届的美国总统大选,那叫一个竞争激烈.可以说,谁拿到了各个州尽可能多的选票,谁选举获胜的几率就会非常大.有人会说,这跟 ...