What is the DOM?
First, some theory. The Document Object Model was put together and accepted by the W3C along about 1998 in an attempt to standardize content on the web. The DOM was attractive to become the standard because its tree-like structure could be adapted to any situation and because it provided a simplistic method of description that could be applied to any document. To help understand this, let’s take a simple example: the HTML document. Consider the following:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>This is my document.</title>
</head>
<body>
<p>This is paragraph one. Isn't it cute?</p>
<p>This is paragraph two.</p>
</body>
</html>
The code above is a very simple HTML document and I can imagine no one reading this ever creates anything this small or simple, but it serves to illustrate well. The DOM specifies that every document has a root node (think of it as a tree trunk) and that node serves as a container for the rest of the document. In our example, the root node is the html tag. Our document begins with <html> and ends with </html> and those root node tags act as a container of everything else in the document. Nothing new here, it’s just a little different way of looking at what we’ve worked with for years.
Now let’s dissect that document. It has two main nodes or branches, the head and the body. The head of our document contains only one other branch, the title node, but it could contain others, such as meta tags, script tags, and other elements typically found in the head of an html document. The body is the other part of the document and ours contains only two paragraph nodes or branches, but it could contain tables, divs, images and all the other tags and content that typically make up the body of an html document. The body is what people actually see in the browser when they open an html document, but the head is just as important, as it provides the instructions that allow the body to behave in a particular way. Both work together to create the html document that makes up our page.
Now let’s consider another example that may not be quite as familiar to most readers: the XML document. Consider the following example, which is a much shorter version of one we used In the past, a CD Catalog. For our purposes here, I shortened it to contain just two CDs because that is enough to illustrate the structure of the document.
In early 1996, Nancy Gill picked up her first book on HTML and permanently said goodbye to the legal field. She has been busy ever since developing web sites for businesses, organizations and social groups in Central California and occasionally beyond. Nancy has served as a member of Team Macromedia since late 2001, first with UltraDev and then moving to Dreamweaver when the programs were consolidated in 2002. She also serves as Assistant Manager for the Central California Macromedia User's Group.