使用 jq／js 判断一个元素是否含有指定 class

　　利用 jq 来判断某个元素是否存在指定的 class

　　jq有两种方法来判断：

　　1. hasClsaa() 

if( $("#div").hasClass(" className1 ") ){
    
    // $("#div").hasClass(" className1  className2 ") ;  // 判断两个class
    // $("#div").hasClass(" className1 ") ;     返回true 或 false
    存在进行下面的操作  
}

　　2. is() 用法和 hasClass() 的用法 一样

 if( $("#div").is(" className1 ")  ){
     
     // $("#div").is(" className1  className2 ") ;  // 判断两个class
     // $("#div").is(" className1 ") ;     返回true 或 false
     存在进行下面的操作  
 }

　　那么这两个方法有什么区别呢？从性能来说，hasClass() 方法的性能高于 is() 。 

　　jq 源码的实现方式　　

var rclass = /[\t\r\n\f]/g;

jQuery.fn.extend({
    hasClass: function(selector) {
        var className = " " + selector + " ",
            i = 0,
            l = this.length;
        for (; i < l; i++) {
            if (this[i].nodeType === 1 &&
                (" " + this[i].className + " ").replace(rclass, " ").indexOf(className) > -1) {
                return true;
            }
        }
        return false;
    }
})

//**
源码里面用到了nodeType，nodeType是HTML DOM 的nodeType 属性，nodeType 属性返回以数字值返回指定节点的节点类型。常用的一般有三种：
如果节点是元素节点（Element），则 nodeType 属性将返回 1。
如果节点是属性节点（Attr），则 nodeType 属性将返回 2。
如果节点是文本节点（Text），则nodeType 属性将返回 3。
**//
想了解更多：HTML DOM nodeType属性  http://www.w3school.com.cn/jsref/prop_node_nodetype.asp

　　js 原生的实现方式　　

　方法1:

function  hasClassFun( element, cls){
    return (' ' + element.className + ' ').indexOf(' ' + cls + ' ') > -1;
}

hasClassFun( document.querySelector(" 元素名 "), " 存在的className ")；

 

　方法2: 用classList这个H5 API，有兼容性问题 针对class只有一个值的情况

 var div = document.getElementsByClassName('div');

div.classList.contains('className');return true或false

　 方法3: 用 className 这个属性 针对class只有一个值的情况

var div = document.getElementsByClassname(" div ");
if( div.className == "className "){
   return turn or false  
}