The Document Object Model (DOM)
By Stephen Bucaro
The elements on a Web page are arranged like branches on a tree (more like an
inverted tree, since the root is the top). Each html element represents a
node in the DOM tree. Each html element is defined by an opening tag and
a closing tag. An Html element that is nested inside another tag is a child
node of that parent node.
The purpose of the DOM is to provide an operating system and programming
language independent interface to the elements on a Web page. This allows
designers using different platforms and languages to modify and style Web pages.
Unfortunately, things didn't start out that way.
The browser world started out with two competing models, one created for
Netscape Navigator, the other for Microsoft Internet Explorer. Unfortunately,
the two object models were not entirely compatible. As each company released new
versions of their browsers, they used object models that were not completely
compatible with that companies previous version. Finally the World Wide
Consortium (W3C) was established to create an international standard.
Unfortunately, that compounded the problem.
The W3C created the W3C DOM which was not entirely compatible with neither
Netscape's nor Microsoft's browser model. Then the W3C released the W3C DOM
Level 2, and W3C DOM Level 3 standards. Now we have a whole pile of incompatible
standards, leaving designers leafing through dog-eared compatibility charts,
while writing convoluted browser detection algorithms (none of which ever
performed properly).
Ultimately all browsers are supposed to comply with the latest W3C standard, and
browser developers are working to achieve that goal - but it won't happen any
time soon. However, after leafing through your latest compatibility charts,
you'll learn that, at least in the basic DOM, a higher level of compatibility
has been achieved. The secret to good web design is to use a conservative approach.
Don't try to design for compatibility with browsers more than one version
previous to the latest release. Those old browsers are used by only a tiny
segment of users, and that is not the big-spender segment. Don't try to design
for the latest gee-wiz trivial feature of the latest browser versions, stick
with the core basic DOM, which has the most universal compatibility.
The DOM chart provided here shows only part of the DOM. I would have liked to
provided a more complete chart, but I can't find an example of a DOM chart that
is complete without getting overly complex.
| 
About BTH
User Agreement
Privacy
Site Map
Contact
News Feeds
RSS Feed
Follow @Stephen Bucaro
General Web Design
