Hide an html element by id using JavaScript
In this post we will give you information about Hide an html element by id using JavaScript. Hear we will give you detail about Hide an html element by id using JavaScriptAnd how to use it also give you demo for it if it is necessary.
we are going to learn about two different ways to hide an HTML element by id using JavaScript.
Consider, we have a following html div element.
<div id="container">Hello</div>
To hide an element, first we need to access it inside the JavaScript using the document.getElementById() then set its style.display property to none.
Here is an example:
const element = document.getElementById("container");element.style.display= "none";
Using style.visibility property
Similarly, we can also hide an html element by setting the element’s style.visibility propertyto hidden.
const element = document.getElementById("container");element.style.visibility= "hidden";
The main difference between style.display and style.visibility properties are:
-
When we set a style.display property to none, it removes the element completely from the dom .
-
When we set a style.display property to hidden, it just hides the element but doesn’t remove it in the dom.
Hope this code and post will helped you for implement Hide an html element by id using JavaScript. if you need any help or any feedback give it in comment section or you have good idea about this post you can give it comment section. Your comment will help us for help you more and improve us. we will give you this type of more interesting post in featured also so, For more interesting post and code Keep reading our blogs