元素类名的操作

判断一个类名是否存在 hasClass()

HTMLElement.prototype.hasClass=function hasClass(cln){
    cln = cln | '';
    //判断多个类名
    先去首位空格
    cln = cln.replace(/^ +| +$/g,'');
    let ary=cln.split(/ +/);
    let str=this.className;
    let flag=true;
    for(let i =0 ; i<ary.length ; i++){
        let reg = new RegExp(`/(^| )${ary[i]}( +|$)/`);
        if(!reg.test(str)){
            flag = false;
            break;
        }
    }
    
    return flag;
}

添加一个类名

  HTMLElement.prototype.addClass=function addClass(cln){
    cln = cln | '';
    //先判断这个类名是否存在
    if(this.hasClass(cln))return;
     cln=cln.replace(/^ +| +$/g,'');
     let ary=cln.split(/ +/);
      for(let i=0;i<ary.length;i++){
          if(!this,.hasClass(ary[i])){
              this.className+= '' + ary[i];
          }
      }
  }

删除一个类名

HTMLElement.prototype.removeClass=function removeClass(cln){
    cln = cln | '';
    cln = cln.replace(/^ +| $/g,'');
    let ary=cln.split(/ +/);
     let str=this.className;
    for(let i=0;i<ary.length;i++){
        let reg=new RegExp('\\b'+ary[i]+'\\b','g');
        str.replace(reg,'');
    }
    str.replace(/ +/g,'');
    this.className=str;
}

toggleClass有就删除没有就添加

HTMLElement.prototype.toggleClass=function toggleClass(cln){
    this.hasClass(cln) ? this.removeClass(cln) : this.addClass(cln);
   
}