Jak Mogę wybrać element z wieloma klasami w jQuery?

Możesz to zrobić za pomocą filter() Funkcja:

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

Do sprawy

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

Trzeba by umieścić spację pomiędzy .a i .b.c

$('.a .b.c')

Problem polega na tym, że używasz Group Selector, podczas gdy powinieneś używać Multiples selector! Aby być bardziej szczegółowym, używasz $('.a, .b'), podczas gdy powinieneś używać $('.a.b').

Aby uzyskać więcej informacji, zobacz przegląd różnych sposobów łączenia selektorów poniżej!

Selektor Grup :", "

Select all <h1> elements AND all <p> elements AND all <a> elements :

$('h1, p, a')

Multiples selector: "" (brak znaku)

Zaznacz wszystkie <input> elementy type text, z klasami code i red:

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

Selektor potomka: "" (spacja)

Wybierz wszystkie <i> elementy wewnątrz <p> elementy:

$('p i')

Child Selector: "> "

Wybierz wszystkie <ul> elementy, które są bezpośrednimi potomkami elementu <li>:

$('li > ul')

Sąsiedni Selektor Rodzeństwa: "+ "

Zaznacz wszystkie <a> elementy, które są umieszczone bezpośrednio po <h2> elementy:

$('h2 + a')

Ogólne Rodzeństwo Selektor: "~ "

Wybierz wszystkie <span> elementy, które są rodzeństwem <div> elementów:

$('div ~ span')

$('.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>

Wystarczy wspomnieć o innym przypadku z elementem:

Np. <div id="title1" class="A B C">

Wpisz: $("div#title1.A.B.C")

Vanilla JavaScript solution: -

document.querySelectorAll('.a.b')

Dla lepszej wydajności można użyć

$('div.a.b')

Będzie to przeglądać tylko elementy div zamiast przechodzić przez wszystkie elementy html, które masz na swojej stronie.

Selektor Grup

body {font-size: 12px; }
body {font-family: arial, helvetica, sans-serif;}
th {font-size: 12px; font-family: arial, helvetica, sans-serif;}
td {font-size: 12px; font-family: arial, helvetica, sans-serif;}

Staje się to:

body, th, td {font-size: 12px; font-family: arial, helvetica, sans-serif;}

Więc w Twoim przypadku próbowałeś selektora grupy, podczas gdy jest to skrzyżowanie

$(".a, .b") 

Zamiast tego użyj tego

$(".a.b") 

Nie potrzebujesz jQuery do tego

W Vanilla możesz zrobić:

document.querySelectorAll('.a.b')

Możesz użyć metody getElementsByClassName() do tego, co chcesz.

var elems = document.getElementsByClassName("a b c");
elems[0].style.color = "green";
console.log(elems[0]);

<ul>
  <li class="a">a</li>
  <li class="a b">a, b</li>
  <li class="a b c">a, b, c</li>
</ul>