js通过classname来获取元素的⽅法
原⽣JS有3种⽅式来获取元素:
getElementById('id')
getElementsByName('name')
getElementsByTagName('tag')
getElementById是获取元素最快的⽅式,但我们不能给每个HTML元素都加以ID吧,所以我们需要⼀个很⽅便的通过className来获取元素
function getElementsByClassName(className,tagName){
var ele=[],ElementsByTagName(tagName||"*");
for(var i=0;i<all.length;i++){
if(all[i].className==className){
ele[ele.length]=all[i];
}
}
return ele;
}
console.log(getElementsByClassName("entry"));原生js和js的区别
console.log(getElementsByClassName("entry","div"));
实现原理很简单,通过getElementsByTagName获取到⼀个元素集合,如果传⼊了tagname这个参数就根据传⼊的tagname来获取,否则获取所有的元素,然后再⼀个⼀个元素来匹配classname是否相等..
上⾯这个⽅法很粗糙,能实现我们的基本需求,如果我们要获取的元素有多个 classname怎么办?
明显通过className==是不⾏了
所以我们只要把上⾯两篇⽂章的hasclass函数搬过来就OK了,我们再次来改造下我们的getElementsB
yClassName函数function getElementsByClassName(className,tagName){
var ele=[],ElementsByTagName(tagName||"*");
for(var i=0;i<all.length;i++){
if(all[i].className.className.match(new RegExp('(\\s|^)'+cls+'(\\s|$)'))){
ele[ele.length]=all[i];
}
}
return ele;
}
这样就能处理⼀个元素含有多个classname的情况了
以上就是⼩编为⼤家带来的js通过classname来获取元素的⽅法全部内容了,希望⼤家多多⽀持~
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论