Как я могу выбрать элемент с несколькими классами в jQuery?

Question

Как я могу выбрать элемент с несколькими классами в jQuery?

Я хочу, чтобы выбрать все элементы, которые имеют два класса a и b.

<element class="a b">

Итак, только те элементы, которые имеют и классы.

когда я использую $(".a, .b") это дает мне Союз, но я хочу перекрестке.

702 11

jQuery javascript css-selectors jquery-selectors

11 ответов:

Comments

Ничего не найдено.

Sasha Chedygov · Accepted Answer · 2015-12-12 17:21:15

если вы хотите пересечение, просто напишите селекторы вместе без пробелов в между.
$('.a.b')
Итак, для элемента, который имеет идентификатор a классы b и c, вы хотели написать:
$('#a.b.c')

Jamie Love · Accepted Answer · 2017-01-30 15:56:34

Вы можете сделать это с помощью filter() функция:
$(".a").filter(".b")

juanpaulo · Accepted Answer · 2016-12-30 17:52:07

по делу
<element class="a">
  <element class="b c">
  </element>
</element>
вам нужно будет поставить пробел между .a и .b.c
$('.a .b.c')

John Slegers · Accepted Answer · 2016-12-29 16:44:03

проблема, с которой вы столкнулись, заключается в том, что вы используете Group Selector, в то время как вы должны использовать Multiples selector! Чтобы быть более конкретным, вы используете $('.a, .b') в то время как вы должны использовать $('.a.b').

для получения дополнительной информации см. обзор различных способов объединить селекторы ниже!

Группа Селектора : ","

выделить все <h1> элементы и все <p> элементы и все <a> элементы :
$('h1, p, a')
кратные селектор: "" (без символа)

выделить все <input> элементов typetext С code и red:
$('input[type="text"].code.red')
селектор потомка : "" (пробел)

выделить все <i> внутри <p> элементы:
$('p i')
Селектор Ребенка : ">"

выделить все <ul> элементы, которые являются непосредственными потомками a <li> элемент:
$('li > ul')
Селектор Соседних Братьев И Сестер : "+ "

выделить все <a> элементы, которые помещаются сразу после <h2> элементы:
$('h2 + a')
Общий Селектор Братьев И Сестер:"~"

выделить все <span> элементы, которые являются элементами <div> элементы:
$('div ~ span')

user2298171 · Accepted Answer · 2017-12-27 09:52:32

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

macio.Jun · Accepted Answer · 2012-12-14 18:15:11

просто упомяните другой случай с элементом:

например.<div id="title1" class="A B C">

просто типа: $("div#title1.A.B.C")

Salman Abbas · Accepted Answer · 2015-01-29 20:02:58

ваниль JavaScript решение: -

document.querySelectorAll('.a.b')

Tejas Shah · Accepted Answer · 2015-09-28 08:26:30

для лучшей производительности вы можете использовать
$('div.a.b')
Это будет выглядеть только через элементы div вместо того, чтобы шагать через все элементы html, которые у вас есть на Вашей странице.

Surya R Praveen · Accepted Answer · 2017-05-17 16:57:26

Группа Селектора
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;}
становится этот:
body, th, td {font-size: 12px; font-family: arial, helvetica, sans-serif;}
так что в вашем случае вы попробовали селектор группы, тогда как его пересечение
$(".a, .b") 
используйте этот код
$(".a.b") 

Sandwell · Accepted Answer · 2018-04-04 11:00:13

не нужно jQuery для этого

на Vanilla вы можете сделать :
document.querySelectorAll('.a.b')

bahman parsamanesh · Accepted Answer · 2018-08-01 13:41:07

можно использовать getElementsByClassName() метод для того, что вы хотите.
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>
Это самое быстрое решение. вы можете увидеть эталон об этом здесь.