Any reason why hide () could be called before show ()?

Question

Why would you need to call hide () before show ()? I would like to know this before I optimize it with a chain of methods.

function ShowSomething() { jQuery("something").hide(); jQuery("something").show(); } 

Answer 1

When hide() called, the initial value of this display element is saved, when show() is called, this initial value is returned. If the initial value is not set, then show() set display:block .

So, if there was originally a display:inline element, but (let it be said) .css("display","none") was called on this element, it would be hidden without saving the initial property. When we again show() this element, it will be given display:block - this is not the initial inline value, which would be if we used hide() .

To summarize: hide() keep the original display value ready for show() to use

Source: jQuery hide () documentation

Answer 2

No difference in output, if it was encoded, other than jQuery, will do a double DOM search twice in the non-attached version.

In terms of performance, lack of chain is 24% slower, as shown below:

See my JSPerf

Answer 3

.hide will be

.hide () starts immediately and redefines the animation queue if duration 0 or duration 0 is not specified.

So, if the animation was already in the queue, it will be deleted and then inserted using .show() . It can also be useful (visually) for certain animations where you move from nonexistent to existence. You can tie them together, it does not matter.

Answer 4

This usually occurs when you have a series of items that need to be displayed one at a time. First, you hide all elements with a specific class, then you show the one you need.