如何选择与多个类jQuery中的元素？

Question

我想选择所有具有两个类a和b的元素。

<element class="a b">

因此，只有元素具有的两个类。

当我使用$(".a, .b")它给我的工会，但我想要的交集。

Answer 1

如果要匹配只的两个类元素（交叉点，就像一个逻辑AND），只写选择器一起的没有空格在两者之间：

$('.a.b')

的顺序是不相关的，所以也可以交换类：

$('.b.a')

因此，为了具有div与类a和b的ID的c元件匹配，可编写：

$('div#a.b.c')

（在实践中，你最有可能并不需要获得特定，并通过自身的ID或类选择通常是足够的。$('#a')）

Answer 2

可以使用 filter() 功能做到这一点：

$(".a").filter(".b")

Answer 3

有关的情况下

<element class="a">
  <element class="b c">
  </element>
</element>

您将需要把空间.a和.b.c之间

$('.a .b.c')

Answer 4

您遇到，问题是，你使用的是Group Selector，而你应该使用Multiples selector！更具体地讲，你使用$('.a, .b')而你应该使用$('.a.b')。

有关详细信息，请参阅的不同方法概述结合选择herebelow！

---

组选择： “”

选择所有<h1>元件和所有<p>元件和所有<a>元素：

$('h1, p, a')

倍数选择： “”（没有字符）

选择<input> type的所有text元素，类code和red：

$('input[type="text"].code.red')

后代选择： “”（空格）

选择<i>元件内部的所有<p>元素：

$('p i')

子选择： “>”

选择，它们是<ul>元件的直接子所有<li>元素：

$('li > ul')

相邻的兄弟选择器： “+”

选择被<a>元件后立即置于所有<h2>元素：

$('h2 + a')

一般兄弟选择： “〜”

选择是<span>元素的兄弟姐妹所有<div>元素：

$('div ~ span')

Answer 5

$('.a .b , .a .c').css('border', '2px solid yellow');
//selects b and c

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

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