Books @ HTML Source

Modern Web Design Using JavaScript & DOM

HTML Source Review

Now that using nice, valid HTML and CSS for layout have been well and truly cracked, it’s time to revisit the possibilities of JavaScript. Recently, the term “DHTML” has become something of a dirty word among most web developers, conjuring up images of all manner of whizz-bang browser effects that often did no more than distract users from what they were trying to do. This is not how it was meant to be...

Stuart Langridge has long been a proponent of “unobtrusive JavaScript” (indeed, he coined the phrase) — the practice of attaching advanced scripts to a webpage which degrade gracefully in browsers that lack the advanced DOM-manipulating functions necessary for the scripts to work optimally. In many cases, the disparities in browser support can be worked around, but fundamentally, a page should never rely on a DHTML effect being possible, but use DHTML to enhance the usability of a page for those with capable browsers (i.e. the majority of web surfers). The problems of browser support can be mitigated by coding defensively: checking for support of each crucial function and property before trying to make use of it.

Unobtrusive JavaScript is a methodology by which scripts can be abstracted from the page they’re to run on: much like CSS files are used to store all of a page’s style information, external JavaScript files are used to store all of a page’s behaviour. This allows event handlers to be attached to page elements without polluting your HTML code with dozens of inline event handlers. For examples of the practice, see Stuart’s seminal sortable tables and search term highlighting.

Modern Web Design Using JavaScript & DOM does assume a rudimentary working knowledge of JavaScript, HTML and CSS, so that we can get straight to interesting and useful implementations of the technology. Deprecated practices like adding inline event handlers to HTML are completely left out of this book, teaching you the best way to do it from the outset — this is all state-of-the-art stuff.

DHTML is back, and it’s going to be a very important part in the future of web design.

Each chapter is structured as a set of practical examples, interspersed with descriptions of the theory behind them, which build on each other as the chapter progresses, eventually reaching a fully-realised DHTML effect, such as highlighted tables or animated tooltips.

Many descriptions of advanced DOM scripting such as this can quickly become mired in discussions on the various browsers deficiencies and incompatibilities. Not so here, as the text is kept refreshingly free of unending details about different browser implementations of DOM methods, instead simply guiding you in the right direction of code branching and feature testing so your code will work as well as possible in each browser.

There’s even a chapter on the current hot-topic, “AJAX”, which allows you to update the current page using data discovered through covert calls back to the server, without having to reload the whole page. The possibilities of this recently re-discovered ability have only just started becoming apparent, and the technology has loads of potential.

Though it had a shaky start, DHTML is back, and it’s going to be a very important part in the future of web design.

—Ross Shannon, 12th June 2005

Where you can get it

You can read four sample chapters of this book online for free.

More details on Modern Web Design Using JavaScript & DOM at SitePoint’s site, or order it direct to your door.

Stuart Langridge
ISBN Number:
May 2005
Chapter Listing:
  1. Introduction
  2. DHTML Technologies
  3. The Document Object Model
  4. Handling DOM Events
  5. Detecting Browser Features
  6. Animation
  7. Forms and Validation
  8. Advanced Concepts and Menus
  9. Remote Scripting
  10. Communicating With The Server
  11. DOM Alternatives: XPath