hidden selector in jQuery with example



Hidden selector returns all hidden elements in the page.


Example :



    <html>
    <head>
    <title>hidden Selector</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"> </script>
    <script type="text/javascript">
    $(document).ready(function()
    {
    $("#myButton").click(function()
    {
    $("p:hidden").removeAttr("hidden").css({'background-color':'Orange','font-size':'20px'});
    });
    });
    </script>
    </head>
    <body>
    <p id="hiddenP" hidden="hidden">This is paragraph element.</p>
    <button id="myButton">Click Me</button>
    <button onclick="location.reload()">Reset</button>
    </body>
    </html>
    

Demo :






In the above example, we have used hidden selector. Hidden selector return all elements that are hidden. In the above example the hidden selector selects the hidden div and applies CSS to it.

0 comments:

Post a Comment