Creating DHTML Applications - (2/8)
Creating DHTML Applications
At a very basic level, DHTML involves using a client-side scripting language to change the property of an object in a document. For example, if you want to move a layer horizontally (with layer, I refer to a 'container' in the HTML page, this can be an absolutely positioned div or span), you will change the left property of that layer; or if you want to have a rollover, you will change the source property of the particular image.
There are three levels in the development process:
- BEHAVIOR level: "What is it that we want to do, what is the purpose of the application?"
- PROPERTY level: "What are the properties we will have to change to script the behavior?"
- DOM (document object model) level: "What object(s) do we need to change the properties of?"
Usually, the most fulfilling part for the developer is the bit where the developer (or team) tries to 'invent' the best way of solving the problem; to solve the 'business logic.' I call this stage programming at the 'BEHAVIOR level.'
At this stage, developers should not have to think too much about programming syntax. The amount of 'exceptional coding,' in other words, is minimal at this level. By 'exceptional coding,' I mean the 'hacks' that every developer uses to get things working on different browsers or platforms.
The PROPERTY level, on the contrary, will require a large amount of exceptional code, but will in most situations be fairly simple.
For example, if the objective is to move a layer 10 pixels to the left, on a certain event, the best way to do it is:
- Measure where the layer is
- Subtract 10 from the result
- Set the new position of the layer
It is only during step c that one runs into problems. The objective is to give the left-property of the layer a certain value, but we know that this is done differently in, for example, Netscape and MS Internet Explorer.
This problem needs to be solved separately from the business logic, and is one of the reasons why PROPERTY scripting is abstracted from BEHAVIOR scripting.
The third level in the development process is solving the DOM-related problems. Using the previous example, even when the left-property in all our target browsers is set, there is one problem to solve: "How do we refer to that object in all different situations?" The exceptional coding in this case often goes together with the exceptional coding in the PROPERTY level, but this is not always the case. Therefore this level also needs to be abstracted.
- Case Study
Created: July 23, 2001
Revised: July 23, 2001