HTML and CSS Reference
In-Depth Information
Introducing Nodes
In the last tutorial, you saw how you could work with document objects to retrieve text
strings from and write text strings to Web page elements. The object tree discussed in that
tutorial is a simplified version of a more complete object hierarchy using nodes. A node
represents any object within a Web page or Web browser. Each element tag, element
attribute, and text string is a node, including the element tags in the document's head
section, comment tags, and the <html> tag itself. For example, the HTML code
<h1>Table of Contents</h1>
consists of two nodes—one node for the h1 element and one node for the text string,
Table of Contents , contained within that element.
The Node Tree
Nodes are arranged into a hierarchical structure called a node tree. Figure 14-7 shows a
representation of a node tree for a simple HTML document. Note that in the node tree,
each element is treated as a separate node; and within each element, the text is treated
as a node as well.
Figure 14-7
a sample node tree
<title>Historic Documents</title>
<h1>Dept. of History</h1>
<p>The <b>constitution</b> online.</p>
"Historic Documents"
"Dept. of History"
Nodes in the node tree have a familial relationship—each node can be a parent,
child, and/or sibling of other nodes. This relationship is indicated using the expression
node . relationship
where node is a currently selected node or object, and relationship is the relationship
of another node to the current node. For example, the expression
node .parentNode
refers to the parent of node . In the node tree shown in Figure 14-7, the parent of the
body node is the html node, and the parent of the html node is the document node,
which is also known as the root node .
Search WWH ::

Custom Search