如何获取具有多个类的元素

提问者：小点点

假设我有这个:

<div class="class1 class2"></div>

如何选择此div元素？

document.getElementsByClassName('class1')[0].getElementsByClassName('class2')[0]

那是行不通的。

我知道在jQuery中，它是$('.class1.class2')，但我想用普通JavaScript来选择它。

共3个答案

匿名用户

它实际上与jQuery非常相似:

document.getElementsByClassName('class1 class2')

MDN文档getElementsByClassName

匿名用户

带有标准类选择器的querySelectorAll也适用于此。

document.querySelectorAll('.class1.class2');

匿名用户

和（均为类）

var list = document.getElementsByClassName("class1 class2");
var list = document.querySelectorAll(".class1.class2");

或（至少一个类）

var list = document.querySelectorAll(".class1,.class2");

异或（一个类而不是另一个类）

var list = document.querySelectorAll(".class1:not(.class2),.class2:not(.class1)");

NAND（不是两个类）

var list = document.querySelectorAll(":not(.class1),:not(.class2)");

NOR（不是两个类中的任何一个）

var list = document.querySelectorAll(":not(.class1):not(.class2)");