42Part IIJavaScript TutorialParents and childrenLooking more closely at (Best web hosting)
42Part IIJavaScript TutorialParents and childrenLooking more closely at the pelement and its content in Figure 4-12, you can see that elementhas three childnodes. The first and last are of the text node type, while the middle one is anelement node. When an element contains multiple child nodes, the sequence of child nodes isentirely dependent upon the HTML source code order. Thus, the first child node of the pele- ment is the text node containing the text This is the . In the case of the emelement, a singlechild text node is the sole descendant of the element. Element node children are not always text nodes, nor do branches always end in text nodes. In Figure 4-12, the htmlelement has two child nodes, both of which are element nodes; thebodyelement has one child node, the pelement. Even though the headelement node appearsto be at the end of a branch, it is still an element node because it is capable of containingother nodes (such as a titleelement). A tag in the HTML indicates an element node, whether or not it has any child nodes. In contrast, a text node can never contain anothernode it s one of those dead-end leaf type of nodes. Notice that a child node is always contained by one element node. That container is the par- entnode of its child or children. For example from the point of view of the emelement node, ithas both one child (a text node) and one parent (the pelement node). A fair amount of W3CDOM terminology (which you ll meet in Chapter 14) concerns itself with assisting scripts tostart at any point in a document hierarchy and obtain a reference to a related node if neces- sary. For instance, if a Dynamic HTML script wants to modify the text inside the emelement ofFigure 4-12, it would typically do so by starting with a reference to the emelement via thedocument.getElementById()command (assuming the emelement has an ID assigned to it) and then modifying the element s child node. In case you re wondering, the documentobject at the top of the node tree is, itself, a node. Its place in the tree is special and is called, simply, the document node. Each document con- tains a single document node, and that node becomes the scripter s gateway to the rest of the document s nodes. It s no accident that the syntax for referencing an element node document.getElementById() begins with a reference to the documentobject. What Defines an Object? When an HTML tag defines an object in the source code, the browser creates a slot for thatobject in memory as the page loads. But an object is far more complex internally than, say, a mere number stored in memory. The purpose of an object is to represent some thing. Inthe browser and its Document Object Model, the most common objects are those that corre- spond to elements, such as a text input form field, a table element, or the whole HTML docu- ment. Outside of the pared-down world of the DOM, an object can also represent abstractentities, such as a calendar program s appointment entry or a layer of graphical shapes in adrawing program. It is common for your browser scripts to work with both DOM objects andabstract objects of your own design. Every type of DOM object is unique in some way, even if two or more objects look identical toyou in the browser. Three very important facets of an object define what it is, what it lookslike, how it behaves, and how scripts control it. Those three facets are properties, methods, and event handlers. They play such key roles in your future DOM scripting efforts that theObject Quick Reference in Appendix A summarizes the properties, methods, and event han- dlers for each object in the object models implemented in various browser generations.