HTML and CSS Reference
In-Depth Information
document
root node
<html>
(document.childNodes
[
0
]
)
<head>
<body>
(document.childNodes
[
0
]
.childNodes
[
0
]
)
<title>
<h1>
“My Title”
“heading 1”
(document.childNodes
[
0
]
.childNodes
[
0
]
.childNodes
[
0
]
.childNodes
[
0
]
)
Figure 15.4
Tree hierarchy of nodes.
A sibling, like a brother or sister, is a node on the same level as another node. In the
example,
<p>
<em>this is </em>some <b>text</b>
</p>
the parent node is
<p>
and has two children, the
<em>
node and the
<b>
node. Because
the
<em>
and
<b>
tags are at the same level within the text, they are called siblings,
brother or sister nodes.
When walking down the DOM tree, you can find out the name of a node and the type of
the node with the
nodeName
and
nodeType
properties. Table 15.4 gives the value for each
of the properties. Dealing with all these nodes can be confusing to say the least, so the
DOM provides methods for quick retrieval of elements:
getElementById()
and
getElements-
ByTag Name()
, discussed in the next section.
Table 15.4
The
nodeName
and Its Type
Node
nodeName Property
nodeType Property
Element
Name of the element (
h1
,
p
)
1
Attribute
Name of the attribute (
id
,
href
)
2
Text
#text
3
