Skip to content

24 ways to impress your friends

Vote down?

Hikari

Great tip and great comments!

I believe ppl are afraid of document.write() because in the past it was used to <b>add HTML on the fly</b>.

That’s the problem. What we must focus is that HTML must be loaded in the document always when possible, and have only the content; CSS must have the presentation and JavaScript the behavior.

But our intelligence is above those rules. The best dropdown menus are built only with CSS, although that’s behavior.

Saying that document.write() is bad, is the same as saying that weapons are bad. Weapons don’t kill ppl, ppl that uses weapons kill ppl.

&amp;

My suggestion is to add to HTML all noscript and scripted elements, and set on normal CSS (or split it, if it gets too large, anyway) the styles for all of them.

Then, for noscript elements, add some class like <b>prefix-js-hide<b> – in the HTML, which will NEVER be referenced in CSS -, and for scripted elements add something like <b>prefix-js-show</b> – which will be set on CSS as <code>prefix-js-show{display:none;}</code>.

And finally, in our marvelous js file, just in the beginning and outside any function, we test if the browser works as intended and if so (inside the if clause), we attach the startup function to body load and document.write():

<code><style>
.prefix-js-hide{display:none; !important}
.prefix-js-show{display:block; !important}
</style></code>

Maybe add a third class for inline elements that should be shown. But the important thing is that this is the smallest style code that should be added by JavaScript, and everything else will be dealt by the normal CSS file. Clean and functional.