Question

我试图为每个li元素添加.active类，但只有当#books与#post具有相同的类/类时。

但是classList函数似乎不适用于hasClasses函数。

var classList =$('#post').attr('class').split(/\s+/);
$.each( classList, function(index, item){
});
$.fn.extend({
 hasClasses: function( selector ) {
    var classNamesRegex = new RegExp("( " + selector.replace(/ +/g,"").replace(/,/g, " | ") + " )"),
        rclass = /[\n\t\r]/g,
        i = 0,
        l = this.length;
    for ( ; i < l; i++ ) {
        if ( this[i].nodeType === 1 && classNamesRegex.test((" " + this[i].className + " ").replace(rclass, " "))) {
            return true;
        }
    }
    return false;
}
});
if ($('#books').hasClasses(classList)) {
$('li').addClass('active');

}

Answer 1

使用.is(".classA.classB.classC")

如果选择器有多个类..让我们说

<a href="#" class="link a b c">Some link</a>

$('.link').is('.a.b.c')将返回true。

<强> JSFIDDLE DEMO

或您想要使用以下函数.hasClasses(["classA","classB","classC"])来检查选择器是否具有类列表。 hasClasses将一个字符串数组作为输入。

<强> JSFIDDLE DEMO 2

$.fn.extend({
    hasClasses: function (classArray) {
        var $this = $(this);
        var classList = '.' + classArray.join('.');
        console.log(classList);
        //Use .is() to check if the classes are present in the selector
        if ($this.is(classList)) {
            return true;
        }
        return false;
    }
});

var classArray = $('#post').attr('class').split(/\s+/);
console.log("Comma separated classes:" + classArray);

var result = $('#post').hasClasses(classArray);

alert("Selector contains these classes? " + result);

带有hasClasses的Jquery classList

1 个答案: