javascript - Why does jQuery show/hide use display:none instead of visibility:hidden?

Question

display:none means that the element isn't rendered as part of the DOM, so it's not loaded until the display property changes to something else.

visibility:hidden loads the element, but does not show it.

Why does jQuery use display:none for its show/hide functions instead of switching between visibility:hidden and visibility:visible?

Answer 1

Because in display:none, the element, for all purposes, ceases to exist -- it doesn't occupy any space. However, in visibility:hidden, it's as if you had just added opacity:0 to the element -- it occupies the same amount of space but just acts invisible.

The jQuery creators probably thought the former would be a better fit for .hide().