jquery - 检查 div 是否有我列表中的类

Question

我正在寻找一种方法来检查一个 div 是否有我列表中的类。例子：

我的类列表：.cat、.dog和.fish

如果 div .animals只有具有这些类的 div，请做一些事情，但是如果我的列表中不包含另一个类（即：.cat、.dog、.fish和.house）或者缺少一个类（即: .cat和.dog) 做一些不同的事情。

有办法做到这一点吗？我试图检查 .has()、.hasclass() 和 .is()，但我无法让它按我的意愿工作。

Answer 1

var $el = $('.animals');
// using .is makes sure it doesn't matter the order
if ( $el.is('.cat.dog.fish') ) {
    if ( $.trim($el.attr('class').replace(/\b(animals|cat|dog|fish)\b/g, '')) ) {
        // it has some other class
        return;
    }
    // You're good to go
} else {
    // does not have all classes
}

向正则表达式添加了边界和全局标志。

基于OP评论中的小提琴：

var $el = $('.animals');
var children = $el.children();
if ( children.filter(":not(.dog):not(.cat):not(.fish)" ).length ) {
    // Something else is in there
    alert("There's something else!");
} else {
    if ( ! children.filter('.dog').length || ! children.filter('.cat').length || ! children.filter('.fish').length ) {
        // Something is missing
        alert("You're missing something");
        return;
    }
    // Good to go.
    alert("Everything is good!");
}

不过，我很确定有一种更有效的方法可以做到这一点。

Answer 2

只需使用 hasClass();

像这样...

 var check = $('.animals').hasClass('fish cat dog');
 if(check) {
 //do stuff you wanna do   
 } else {
 //do other stuff
 }

但是，如果您想检查它是否具有其中一个类，这将检查它是否按该顺序具有这些类。然后做...

var dog = $('.animals').hasClass('dog');
var cat = $('.animals').hasClass('cat');
var fish = $('.animals').hasClass('fish');

然后你可以为你需要的那些变量做一个 if 。

if((dog)&&(cat)&&(fish)){
 //do stuff
 } else {
 //do other stuff
 }

ETC...