关于javascript：如何在jquery中选择具有多个类的元素？

How can I select an element with multiple classes in jQuery?

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

1	<element class="a b">

所以，只有两个类都有的元素。

当我使用$(".a, .b")时，它给了我一个联合，但我想要交叉点。

相关讨论

如果只想将元素与两个类(交叉点，如逻辑与)匹配，只需将选择器写在一起，中间不带空格：

$('.a.b')

顺序不相关，因此您还可以交换类：

$('.b.a')

因此，要将ID为a的div元素与类b和c匹配，您需要编写：

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

(实际上，您很可能不需要获得特定的ID或类选择器，而一个ID或类选择器本身就足够了：$('#a')。)

相关讨论

您可以使用filter()函数执行此操作：

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

相关讨论

对于这种情况

1
2
3
4

你需要在.a和.b.c之间留出一个空间。

1	$('.a .b.c')

相关讨论

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

有关更多信息，请参见下面的组合选择器的不同方法概述！

组选择器："，"

选择所有元素和所有

元素和所有元素：

1	$('h1, p, a')

多个选择器："(无字符)

选择typetext的所有元素，分类为code和red：

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

后代选择器：""(空格)

选择

元素中的所有元素：

$('p i')

子选择器：">"

选择作为

元素的直接子元素的所有

1	$('li > ul')

相邻的同级选择器："+"

选择直接放在元素之后的所有元素：

1	$('h2 + a')

常规同级选择器："~"

选择属于元素的所有元素：

1	$('div ~ span')

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

1
2
3
4
5
6

普通JavaScript解决方案：

document.querySelectorAll('.a.b')

只需提到另一个包含元素的案例：

如。

公正的类型：$("div#title1.A.B.C")。

为了获得更好的性能，您可以使用

1	$('div.a.b')

这将只查看DIV元素，而不是单步执行页面上的所有HTML元素。

群选择器

1
2
3
4

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;}

变成这样：

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

所以在您的例子中，您尝试了组选择器，而它是一个交叉点

1	$(".a, .b")

而是用这个

$(".a.b")

你不需要jQuery来做这个

在Vanilla中，您可以：

1	document.querySelectorAll('.a.b')

相关讨论

您可以使用getElementsByClassName()方法来满足您的需要。

1
2
3

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

1
2
3
4
5
6
7
8
9
10
11
12
13

这也是最快的解决方案。你可以在这里看到一个基准。