jQuery中hasClass的实现问题


//如下实现是对JQuery的hasClass方法进行简化，直接书写成function格式

//获取className, 也可以通过访问元素的className属性来获取
function getClass(elem) {
    return elem.getAttribute && elem.getAttribute("class") || "";
}

//jQuery的实现会判断nodeType是否为1，同时需要注意className和selector的左右
//都被添加了一个空格字符，这是为了后面使用indexOf判断的准确性
function hasClass(elem, selector) {
    var className = " " + selector + " ";
    if(elem){
        if ( elem.nodeType === 1 &&
            ( " " + 
stripAndCollapse( getClass( elem ) ) + " " ).indexOf( className ) > -1 ) {
                return true;
        }
    }
    return false;
}

//stripAndCollapse中正则表达式中的\x20，就是指的空格键，\x标明数值20是16进制，
//换成十进制就是32
function stripAndCollapse( value ) {
    var tokens = value.match( /[^\x20\t\r\n\f]+/g) || []; 
    return tokens.join( " " );
}

//*************************************************************
//如下是一个简单的实现方法（没有做一些细致的检查）
function hasClass(elem, name){
    return " " + elem.className + " ".indexOf(" " + name + " ") > -1;
}

参考：关于为何需要在className和selector左右添加空格的讨论

lynxerzhang / JSSkills

jQuery中hasClass的实现问题 #12