详解javascript常用工具类的封装(6)

7. DOM

$ (selector){ 
  var type = selector.substring(0, 1);
  if (type === '#') {
    if (document.querySelecotor) return document.querySelector(selector)
      return document.getElementById(selector.substring(1))
    
  }else if (type === '.') {
    if (document.querySelecotorAll) return document.querySelectorAll(selector)
      return document.getElementsByClassName(selector.substring(1))
  }else{
    return document['querySelectorAll' ? 'querySelectorAll':'getElementsByTagName'](selector)
  }
} 

/*检测类名*/
hasClass (ele, name) {
  return ele.className.match(new RegExp('(\\s|^)' + name + '(\\s|$)'));
}

/*添加类名*/
addClass (ele, name) {
  if (!this.hasClass(ele, name)) ele.className += " " + name;
}

/*删除类名*/
removeClass (ele, name) {
  if (this.hasClass(ele, name)) {
    var reg = new RegExp('(\\s|^)' + name + '(\\s|$)');
    ele.className = ele.className.replace(reg, '');
  }
}

/*替换类名*/
replaceClass (ele, newName, oldName) {
  this.removeClass(ele, oldName);
  this.addClass(ele, newName);
}

/*获取兄弟节点*/
siblings (ele) {
  console.log(ele.parentNode)
  var chid = ele.parentNode.children,eleMatch = []; 
  for(var i = 0, len = chid.length; i < len; i ++){ 
    if(chid[i] != ele){ 
      eleMatch.push(chid[i]); 
    } 
  } 
  return eleMatch;
}

/*获取行间样式属性*/
getByStyle (obj,name){
  if(obj.currentStyle){
    return obj.currentStyle[name];
  }else{
    return getComputedStyle(obj,false)[name];
  }
}

8. Storage 储存操作

class StorageFn {
  constructor () {
    this.ls = window.localStorage;
    this.ss = window.sessionStorage;
  }

  /*-----------------cookie---------------------*/
  /*设置cookie*/
  setCookie (name, value, day) {
    var setting = arguments[0];
    if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
      for (var i in setting) {
        var oDate = new Date();
        oDate.setDate(oDate.getDate() + day);
        document.cookie = i + '=' + setting[i] + ';expires=' + oDate;
      }
    }else{
      var oDate = new Date();
      oDate.setDate(oDate.getDate() + day);
      document.cookie = name + '=' + value + ';expires=' + oDate;
    }
    
  }

  /*获取cookie*/
  getCookie (name) {
    var arr = document.cookie.split('; ');
    for (var i = 0; i < arr.length; i++) {
      var arr2 = arr[i].split('=');
      if (arr2[0] == name) {
        return arr2[1];
      }
    }
    return '';
  }

  /*删除cookie*/
  removeCookie (name) {
    this.setCookie(name, 1, -1);
  }


  /*-----------------localStorage---------------------*/
  /*设置localStorage*/
  setLocal(key, val) {
    var setting = arguments[0];
    if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
      for(var i in setting){
        this.ls.setItem(i, JSON.stringify(setting[i]))
      }
    }else{
      this.ls.setItem(key, JSON.stringify(val))
    }
    
  }

  /*获取localStorage*/
  getLocal(key) {
    if (key) return JSON.parse(this.ls.getItem(key))
    return null;
    
  }

  /*移除localStorage*/
  removeLocal(key) {
    this.ls.removeItem(key)
  }

  /*移除所有localStorage*/
  clearLocal() {
    this.ls.clear()
  }


  /*-----------------sessionStorage---------------------*/
  /*设置sessionStorage*/
  setSession(key, val) {
    var setting = arguments[0];
    if (Object.prototype.toString.call(setting).slice(8, -1) === 'Object'){
      for(var i in setting){
        this.ss.setItem(i, JSON.stringify(setting[i]))
      }
    }else{
      this.ss.setItem(key, JSON.stringify(val))
    }
    
  }

  /*获取sessionStorage*/
  getSession(key) {
    if (key) return JSON.parse(this.ss.getItem(key))
    return null;
    
  }

  /*移除sessionStorage*/
  removeSession(key) {
    this.ss.removeItem(key)
  }

  /*移除所有sessionStorage*/
  clearSession() {
    this.ss.clear()
  }

  
}
      

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/71.html