getElmentsByClassName用法

JS批量获取class命名节点 getElementsByClassName() 
getElementsByClassName() 是一个老的方法了,将其优化整理后给大家提供。 

代码如下: 

// 批量获取class命名节点 
function getElementsByClassName(className, tag, parent){ 
var parent = parent || document; 
var tag = tag||"*"; 
if(!(parent = F$(parent))){return false;} 
// 查找所有匹配标签 
var allTags = (tag == "*" && parent.all) ? parent.all : F$$(tag, parent); 
var classElements = []; 

// 创建一个正则表达是来判断className的正确性 
className = className.replace(/\-/g, "\\-"); 
var regex = new RegExp("(^|\\s)" + className + "(\\s|$)"); 
var elenemt; 
// 检查每个元素 
for(var i=0; i<allTags.length; i++){ 
elem = allTags[i]; 
if(regex.test(elem.className)){ 
classElements.push(elem); 


return classElements; 
}; 

getElementsByClassName(className, tag, parent)接受三个参数: 

className:要获取节点的class名称 

tag:命名class的标签 可选项 默认表示“*”所有标签 

parent:父节点之下的所有内容,也就是获取的范围,可选项 默认表示"document" 

实例: 

HTML: 

<p class="main" id="main"> 
<a href="#" class="my">这是链接</a> 
<span class="my">1</span> 
<span id="sss">2</span> 
<span class="my ttt">3</span> 
<span>4</span> 
</p> 

执行:getElementsByClassName("my", "span", document.getElementById("main")); 

或得到的将是包含 SPAN1、SPAN3 两个个节点的数组 『其中不包含A标签这个节点,因为参数中指定必须是span才提取』。 

还有如下实例: 

getElementsByClassName("my") // 获取文档中所有.my 节点 

getElementsByClassName("my", "span") // 获取文档下以.my命名的span节点 

getElementsByClassName("my", "*", document.getElementById("main")) // 获取#main下的所有.my命名节点。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值