封装类名

封装类名

封装类名需要考虑：
1.getElementsByClassName浏览器兼容；
2.id里面的类名，没有id里面的类名；
3.类名很多个，不一定唯一；

html部分

// html
<div id="box">
    <div></div>
    <div class="demo test one"></div>
    <div class="demo"></div>
    <div class="demo"></div>
    <div class="demo"></div>
    <div></div>
    <div class="demo"></div>
    <div></div>
    <div></div>
</div>

js部分

// js
 function getclass(classname,id) {
  //如果浏览器支持getElementsByClassName，再判断是否提供id
  if(document.getElementsByClassName(classname)){
   if(id){
  return document.getElementById(id).getElementsByClassName(classname);
 }else{
  return document.getElementsByClassName(classname);
}
}
//浏览器不支持getElementsByClassName，判断是否提供id
if(id){
var  dom =  document.getElementById(id).getElementsByTagName("*");
 }else {
 var dom = document.getElementsByTagName("*");
}
 var arr=[];//存放符合条件的类名
for (var i=0;i<dom.length;i++){

var txt=dom[i].className.split(" ");  //分割类名并且转换成数组
 //如：["demo test"]→["demo","test"]
for (var j=0;j<txt.length;j++){
     if(txt[j] == classname){ //判断是否存在类名相同
     arr.push(dom[i]); //满足条件即存放
     }
     }
 }
return arr;
}
console.log(getclass("demo","box").length);

初学js，欢迎交流