It's fairly easy to confuse the Cascading Style Sheets (CSS) properties display and visibility, because it would seem that they do much the same thing. However, the two properties are in fact quite different.
The visibility property determines whether a given element is visible or not (visibility="visible|hidden"). However, when visibility is set to hidden, the element being hidden still occupies its same place in the layout of the page.
The display property, on the other hand, works a little differently. Where visibility hides the element but keeps its flow position, display actually sets the flow characteristic of the element. When display is set to block, for example, everything within the containing element is treated as a separate block and is dropped into the flow at that point as if it were a <DIV> element. If the display property is set to none, then the element is actually removed from the flow completely, and any following elements move forward to compensate.
Of the two, the display property is definitely the more useful, as most instances of needing to hide text also involve shifting the surrounding HTML flow to accommodate it, but it is nice to know that you can remove an element from visibility without affecting HTML flow in some instances as well...
var quotation = 'The author said: "Get out of here!"';
An alternative would be:
var quotation = "The author said: \"Get out of here!\"";
The author said: "Get out of here!"
But some would argue that the first example is more readable because it eliminates negating the double quotes in the string.
Professional Web Developer