使用JavaScript按id隐藏一个html元素的方法

在本教程中，我们将学习使用JavaScript隐藏一个HTML元素的两种不同方法。

考虑一下，我们有一个如下的HTMLdiv 元素。

<div id="container">Hello</div>

要隐藏一个元素，首先我们需要在JavaScript中使用document.getElementById() ，然后将其style.display 属性设置为none 。

下面是一个例子。

const element = document.getElementById("container");

element.style.display= "none";

使用style.visibility属性

同样地，我们也可以通过将元素的style.visibility 属性设置为hidden 来隐藏一个html元素。

const element = document.getElementById("container");

element.style.visibility= "hidden";

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

• 当我们把style.display 属性设置为none 时，会把该元素从域中完全删除。

• 当我们将style.display 属性设置为hidden ，它只是隐藏了该元素，但并没有在dom中移除它。