In a recent post on 456 Berea Street, Jeff Croft made a very valid comment suggesting that using JavaScript to create invalid markup was no better than writing invalid markup in the first place. This is something I totally agree with. The rising popularity of JavaScript following the buzz surrounding by Ajax has meant more and more sites are using javascript more fully, but it's important that developers don't get sloppy just because modifications to the document aren't visible in the source.
Using JavaScript to add non-semantic markup
In my opinion JavaScript shouldn't be used as a means to hide bad code from the source. This includes using JavaScript as a way of hiding both invalid or non-semantic markup. In his re-design of Vivabit I think Patrick Griffiths made the right decision in not using JavaScript to add in the extra markup he needed to make his elastic design with all of it's rounded corners work.As an alternative example the octopus engine script uses 9 divs to give the visual effect of the rounded corners and drop shadows. Whilst it's visually appealing, is this the best use of scripting? Does the fact that the 'real' markup is clean mean it's ok to add a ton of extra markup through JavaScript for CSS hooks?
Using JavaScript to add invalid markup
Another thing to avoid would be using JavaScript to add invalid markup so that your site still passes validation. Developers can use this cheat as it's only the actual source and not the rendered source that is validated. Examples of this would be using JavaScript to write flash objects into a page or any kind of proprietary code just so that your site validates.My view is, if you don't feel comfortable putting it in your markup then don't do it with JavaScript. What's your point of view?
NB: If you're reading this and you don't know how to view source as rendered by the browser including any changes JavaScript made to the document, then the following two Firefox extensions will come in very handy.