Hiding and showing elements

The basic .hide() and .show() methods, without any parameters, can be thought of as smart shorthand methods for .css('display', 'string'), where 'string' is the appropriate display value. The effect, as might be expected, is that the matched set of elements will be immediately hidden or shown with no animation.

The .hide() method sets the inline style attribute of the matched set of elements to display: none. The smart part here is that it remembers the value of the display property—typically block, inline, or inline-block—before it was changed to none. Conversely, the .show() method restores the display properties of the matched set of elements to whatever they initially were before display: none was applied.

Tip ...

Get Learning jQuery - Fourth Edition now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.