Any reason why one would call hide() before show()?

Question

Why would one want to call hide() before show() ? I'd like to know this before i optimize this with method chaining..

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

Answer 1

When calling hide() the initial value of that element's display is stored for when show() is called, that initial value is put back in place. If no initial value is set, then show() will set display:block.

So, if an element was originally display:inline, but (let's say) .css("display","none") was called on that element, it would be hidden with no initial property saved. When we show() this element again it will be given display:block - not it's initial value of inline which is what it would be given if we'd used hide().

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

Source: The jQuery hide() documentation

Answer 2

There's no difference in the output if that was chained, other than jQuery will actually perform the DOM lookup twice on the non-chained version.

In terms of performance, non-chaining is actually 24% slower, as shown below:

See my JSPerf