使用JavaScript按类别隐藏所有元素在本教程中，我们将学习如何使用JavaScript按类别隐藏所有元素。考虑一

在本教程中，我们将学习如何使用JavaScript按类别隐藏所有元素。

考虑一下，我们有以下HTML元素。

<div class="container">
   <div class="box">box 1</div>
   <div class="box">box 2</div>
   <div class="box">box 3</div>
</div>

现在，我们需要通过使用类名来隐藏上述元素box 。

按类别隐藏所有元素

要在JavaScript中按类隐藏所有元素。

这里有一个例子。

<div class="container">
   <div class="box">box 1</div>
   <div class="box">box 2</div>
   <div class="box">box 3</div>
</div>

const elements = document.getElementsbyClassName("box");

for (const el of elements){
    el.style.display= "none";
}

同样，我们也可以通过使用元素的style.visibility 属性，按特定的类别隐藏所有元素。

这里有一个例子。

const element = document.getElementsbyClassName("box");

for (const el of elements){
    element.style.visibility= "hidden";
}

在上面的例子中。

首先，我们使用document.getElementsbyClassName() 方法访问了html元素，然后在每次迭代时，我们都将元素的style.visibility属性更新为hidden 。所以它将元素隐藏在一个dom中。

style.display 和style.visibility 属性之间的主要区别是。