Java Reference
In-Depth Information
<title>This is a test page</title>
</head>
<body>
<span>Below is a table</span>
<table>
<tr>
<td>Row 1 Cell 1</td>
<td>Row 1 Cell 2</td>
</tr>
</table>
</body>
</html>
<html>
There is nothing out of the ordinary here; the document
contains a table with two rows with two cells in each row.
You can once again represent the hierarchical structure of
your page (for example, the fact that the
<html/>
element
contains a
<head/>
and a
<body/>
element, and that the
<head/>
element contains a
<title/>
element, and so on)
using your tree structure, as shown in Figure 9-3.
<head>
<body>
<span>
<title>
<table>
“Below is
a table”
“This is a
test page”
<tr>
<td>
<td>
The top level of the tree is simple enough; the
<html/>
element contains
<head/>
and
<body/>
elements. The
<head/>
element in turn contains a
<title/>
element and
the
<title/>
element contains some text. This text node is
a child node that terminates the branch (a leaf node). You
can then go back to the next node, the
<body/>
element node, and go down that branch. Here you have
two elements contained within the
<body/>
element: the
<span/>
and
<table/>
elements. Although the
<span/>
element contains only text and terminates there, the
<table/>
element contains one row (
<tr/>)
,
and it contains two table cell (
<td/>)
elements. Only then do you get to the bottom of the tree with the
text contained in each table cell. Your tree is now a complete representation of your HTML code.
“Row 1
Cell 2”
“Row 1
Cell 1”
figure 9-3
the Core dom objects
What you have seen so far has been highly theoretical, so let's get a little more practical now.
The DOM provides you with a concrete set of objects, properties, and methods that you can access
through JavaScript to navigate the tree structure of the DOM. Let's start with the set of objects,
within the DOM, that is used to represent the nodes (elements, attributes, or text) on your tree.
Base DOM Objects
Three objects, shown in the following table, are known as the base DOM objects.
objeCt
desCription
Each node in the document has its own
Node
object.
Node
This is a list of
Node
objects.
NodeList
This provides access by name rather than by index to all the
Node
objects.
NamedNodeMap
