In this article we are going to learn how to select elements whose property is not visible or hidden. It simply means that the display property of that particular element is hidden, and we need to show whatever present in that element using the Jquery.
We can easily do this by using the Jquery:hidden selector. First, let’s see how you will know that the element is hidden, these elements are set to display: none; form element with type=”hidden”, Width and height set to 0 or A hidden parent element and this parent will also hide their children.
Syntax –
$(":hidden")
- jQuery show() Method: It is used to show the hidden element selected by selectors.
Syntax:
$(selector).show(speed,easing,callback)
// All parameters are optional.
Example 1 :
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
</script>
<script>
$(document).ready(function () {
$("h1:hidden").show(5500);
});
</script>
</head>
<body>
<h1 style="display: none">GeeksForGeeks</h1>
<p>It is a computer science portal for geeks.</p>
<p>
You can whatever you want to learn in
the computer science field.
</p>
</body>
</html>
|
Output :
Example 2: We have heading tag with display:none property and rest of the tags are visible. When you run the code first it will show you the visible content and then the hidden tags with the help of :hidden selector and .show() method.
HTML
<!DOCTYPE html>
<html>
<head>
<script src=
</script>
<script>
$(document).ready(function () {
$("p:hidden").show(5500);
});
</script>
</head>
<body>
<h1>GeeksForGeeks</h1>
<p style="display: none">
It is a computer science portal for geeks.
</p>
<p style="display: none">
You can whatever you want to learn in
the computer science field.
</p>
</body>
</html>
|
Output :
Whether you're preparing for your first job interview or aiming to upskill in this ever-evolving tech landscape,
GeeksforGeeks Courses are your key to success. We provide top-quality content at affordable prices, all geared towards accelerating your growth in a time-bound manner. Join the millions we've already empowered, and we're here to do the same for you. Don't miss out -
check it out now!