zoukankan      html  css  js  c++  java
  • 获取类名相关

      JS中获取DOM节点的类有3种方法:

    1、classList

      H5的方法,仅兼容IE10+,配套带有remove等api

    2、getAttribute('class')

      据说在低版本IE有兼容问题,建议用方法3

    3、className

      这个方法万能

      

      其实要讲的是看到vue源码里面的一个方法,兼容IE9一个对类进行操作的方法。

      记下来以后用。

    // DOM节点与要删除的类
    function removeClass(el, cls){
      // 这里已经对cls调用了trim()方法
      if(!cls || !cls = cls.trim()){
        return ;
      }
      // classList兼容IE10+
      // 如果支持 直接按空格分割字符串并调用remove方法删除类
      if(el.classList){
        if(cls.indexOf(' ') > -1){
          cls.split(/s+/).forEach(function(c){ return el.classList.remove(c); });
        } else{
          el.classList.remove(cls);
        }
      } 
      // 对IE10以下做兼容 不知道为啥不用className
      else{
        // 修正类集合字符串 两边加空白
        // 'a b' => ' a b '
        var cur = ' ' + (el.getAttribute('class') || '') + ' ';
        // 修正目标类 'a' => ' a '
        var tar = ' ' + cls + ' ';
        // 进行替换 ' a b ' => ' b '
        while(cur.indexOf(tar) >= 0){
          cur = cur.replace(tar, ' ');
        }
        // 再调用trim()操作 ' b ' => 'b'
        el.setAttribute('class', cur.trim());
      }
    }
  • 相关阅读:
    CSS样式权值
    JS正则表达式总结
    call, apply, bind作用
    JSON和JSONP区别
    重重保护下的堆
    [转载]舌尖上的清华 I
    [转载]Windows Phone学生开发者注册教程2月版
    忙碌的生活没有空写博客
    Qt应用之手机截图
    [转]我是设计院的
  • 原文地址:https://www.cnblogs.com/QH-Jimmy/p/6757502.html
Copyright © 2011-2022 走看看