About Dreamweaver DOM

The structure of an HTML document can be seen as a document tree. The root is the html tag, and the two largest trunks are the head tag and the body tag. Offshoots of the head tag include the title, style, script, isindex, base, meta, and link tags. Offshoots of the body tag include:

• Headings (h1, h2, and so on)

• Block-level elements (p, div, form, and so on)

• Inline elements (br, img, and so on)

• Other element types

In a DOM, the tree structure is preserved and presented as a hierarchy of parent nodes and child nodes. The root node has no parent, and leaf nodes have no children. At each level within the HTML structure, the HTML element can be exposed to JavaScript as a node. Using this structure, you can access the document or any element within it.

In JavaScript, you can mention any object in the document by name or by index. For example, consider that a Submit button with the name or ID “myButton” is the second element in the first form in the document. Then, both of the following references to the button are valid:

• By name, as in document.myForm.myButton

• By index, as in document.forms[0].elements[1]

The objects with the same name, such as a group of options, are collapsed into an array. You can access a particular object in the array by incrementing the index with zero as the origin. For example, the first option with the name “myRadioGroup” inside a form called “myForm” is referenced as document.myForm.myRadioGroup[0].