jQuery选择：选择一个类的某些组合时，多个存在

我试图做一些研究已经并没有发现任何东西，但如果我错过了答案，请告诉我。基本上我有多个类，每个类都有多个类，但是组合是唯一的。我想选择某种类别的组合，但不包含其他元素与其他元素结合使用。jQuery选择：选择一个类的某些组合时，多个存在

我想知道，如果在jQuery的存在，或者这个选择，如果有一些其他的方式来完成我所解释。看下面的例子：

<div class="a b c"></div> 
<div class="a b c d"></div> 
<div class="a b c d">/div>

当试图用类a b c只记录的元素，我尝试使用：

$('.a.b.c').each(function() { 
    console.log($(this)); 
}

输出为：

[ <div class="a b c">...</div> , 
<div class="a b c d">...</div , 
<div class="a b c d">...</div> ]

我要找输出为：

[ <div class="a b c">...</div> ]

任何指导表示赞赏。谢谢！

来源

2015-02-07 Wold

你可以使用CSS3 :not() pseudo class否定.d类：(example)

$('.a.b.c:not(.d)').each(function() { 
    console.log($(this)); 
});

jQuery的也有.not() method：(example)

$('.a.b.c').not('.d').each(function() { 
    console.log($(this)); 
});

您也可以使用属性选择器：(example)

[class="a b c"]

注意，为了始终是a b c。只是把它放在那里作为一个选项。

来源

2015-02-07 00:48:15

我不相信你可以直CSS选择这样做，短期使用：不一一列举要排除所有其他类或与一些实操[CLASS =]。不过，你可以做的是选择具有类名为.abc的所有元素，然后筛选出在其类列表超过三个元素的任何元素：

var $abcDivs = $('.a.b.c').filter(function(i, $elem){ 
    return $elem.attr("class").split(' ').length == 3; 
})

更普遍：

function exactClass(classList) { 
    return $(classList.join('.')).filter(function(i, $elem){ 
    return $elem.attr("class").split(' ').length == classList.length; 
    }); 
}

来源

2015-02-07 00:57:10 rmehlinger

感谢您的回答，但另一个适合我的需求更多。 – Wold 2015-02-07 01:02:44

当然可以！我的意图是用于你不知道其他类可能是什么的情况;如果你确切地知道他们是什么，那么第一个更好。 – rmehlinger 2015-02-07 01:06:24

我一直在寻找类似的东西前一段时间，但我没能猜到我不需要什么类（如它们是动态附加）。因此，而不是排除与not()不需要的类，我做了这个以配合只有我知道的类元素。

var classes = ['a','c','b']; 
 

 
$('.'+classes.join('.')).each(function(){ 
 
    var cl = $(this).attr('class'); 
 
    for(var i in classes) { 
 
    cl = cl.split(classes[i]).join(''); 
 
    } 
 
    if(cl.replace(/\s+/, '') === ''){ 
 
    $(this).addClass('blah'); 
 
    } 
 
});

.blah{ 
 
    font-size:30px; 
 
    color : red; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 

 
<div class="a b c d">Foo</div> 
 
<div class="c b a">Bar</div> 
 
<div class=" a b c">Hello</div> 
 
<div class=" a b">World</div>

JSFiddle。作为一种方法：

function el(c){ 
    var a = []; 
    $('.'+c.join('.')).each(function(){ 
     var k = $(this).attr('class'); 
     for(var i in c) k=k.split(c[i]).join(''); 
     if(k.replace(/\s+/,'')==='') a.push(this); 
    }); 
    return a; 
} 

// usage: 
$(el(['a','c','b'])).addClass('blah');

来源

2015-02-07 02:08:07

jQuery选择：选择一个类的某些组合时，多个存在

回答

相关问题