检查类是否包含所有数组项？

Question

我试图查看一个 div 类是否包含所有数组项，然后向该 div 添加“显示：块”。

如果我想为每个单独的类添加“显示：块”，我会这样做：

let arrayList = [car, animal, boat]

for(i=0; i<arrayList.length; i++) {
    let getClass = document.getElementsByClassName(arrayList[i]);
    for(c=0; c<getClass.length; c++) {
        getClass[c].style.display ="block";
    }
}

但是如何检查 div 的所有类是否都在arrayList. 然后添加“显示：块”到它？

例如，如果我有一个具有结构的 div，<div class="car animal boat">我希望它具有“display：block”，但如果 div 结构是，<div class="car animal">我希望它具有“display：none”。

该数组将是动态的。我怎样才能做到这一点？

Answer 1

您可以使用querySelectorAll：

let classes = ["car", "animal", "boat"]
, classTest = "." + classes.join(".")

document.querySelectorAll(classTest).forEach(div => div.style.display = "block")

div { display: none; }

<div class="car animal boat">Show Me</div>
<div class="car boat">Hide</div>
<div class="car animal">Hide</div>
<div class="car animal boat">Show Me too</div>