Chapter 7 -- Using Dynamic HTML

Chapter 7

One of the fastest ways to become familiar with Dynamic HTML (DHTML) is to think of it as a mechanism that allows you to encapsulate HTML elements and then script those elements using Microsoft VBScript or JScript. Almost every aspect of a rendered document is alterable at run time, with the added advantage that it is not necessary to download the entire document again just to change its appearance. Every element in the document becomes an individually addressable object at run time. The browser is capable of changing the look of one object while dynamically rearranging the other objects around it. This means that the objects in a DHTML document are simple, consistent, run-time-programmable entities.

DHTML consists of several components and technologies that work together to provide dynamic features. These components and technologies are:

• Document Object Model The Document Object Model refers to the elements in the document that expose properties, methods, and events that we can program against. Every element in the document is an object with these characteristics. The big learning curve is getting a handle on these objects and their interfaces.
• Dynamic styles You can dynamically change the style of any HTML element in a document. You can change colors, typefaces, spacing, indentation, position, and even the visibility of text. Because the Dynamic HTML Object Model makes every HTML element and attribute accessible, it is easy to use scripts to dynamically read and change styles.
• Dynamic positioning Microsoft Internet Explorer 4.0 supports positioning and animation of elements even after a document has been loaded. Because the Dynamic HTML Object Model gives you access to styles and style sheets, you can set and change the position of an element as simply as you set and change its color. This makes it especially easy to change the position of elements based on how the user is viewing the document and even to animate the elements.
• Dynamic content With Dynamic HTML, you can change the content of a document after it is loaded. Internet Explorer gives you a rich set of properties and methods to dynamically construct and alter documents, from inserting and deleting elements to modifying the text and attributes in individual elements.
• Data binding Several core HTML elements, together with "traditional" data-bound controls, combine to form a very flexible data-oriented architecture. Chapter 16 demonstrates how to use the data-binding features of DHTML.