Dynamic HTML

The latest (and possibly final) revision of the Hypertext Markup Language standard is called HTML 4.0 and is popularly known as "Dynamic HTML" or DHTML. It differs from previous standards in its integration of three crucial advances beyond the original basis of the markup language:

• Scripting (JavaScript, VisualBasic Script)


• Style Sheets (CSS)


• The Document Object Model

You've had a fair amount of exposure to the first pair in the trio, but we have yet to define that third item. The DOM is a scheme by which every element of a Web page--all its tagged features--are exposed to scripts and style sheets. DOM (or DHTML)-capable browsers do far more than simply registering all the IMG tags in an images array: they maintain data on paragraph tags, headings, script containers, and just about anything else you can imagine.

The idea behind this massive increase in information is to make Web pages more dynamic--capable of changing their appearance and even their structure without being reloaded (i.e., without contacting the Web server). Thus DHTML goes along with cookies, database integration, and other techniques meant to overcome the limitations of stateless HTTP.

And now the bad news. There were of course several competing approaches to DHTML--Netscape's, Microsoft's, and the W3C's. Netscape wanted everyone to adopt a special set of proprietary tags, centered around the <LAYER> container, to accomplish many dynamic effects. This did not go over well at the World Wide Web Consortium, which insisted on its own Document Object Model. Uncharacteristically, Microsoft largely went along with the consortium and has steadily brought Internet Explorer into close compliance with the standard.

So we stand with DHTML in very much the same place as with Style Sheets: MSIE behaves wonderfully, Netscape 4.x doesn't do much at all, and we're promised that Netscape 6 will close the gap. Until that happens, we have to keep DHTML effects behind a careful screen of browser detection.

But like Style Sheets, DHTML will eventually become lingua franca (possibly as part of the new XHTML standard); and in learning to use DHTML you can acquire a much more powerful way of thinking about Web pages; so for a little while we shall go boldly where no Navigator dares.

For a quick demonstration of several basic DHTML effects, replacement of innerText, innerHTML, and outerHTML, see the demo page. This week's lab offers a hands-on introduction to these techniques. Detailed information about DHTML features can be found in the course text.