HTML and CSS Reference
In-Depth Information
EXAMPLE
15.1 (
CONTINUED
)
<script type="text/javascript">
2
var Parent=document.childNodes[0]
;
//
First child node is HTML
3
var Child=Parent.childNodes[0]
;
//
Parent's first child is HEAD
document.write("The parent node is: ");
4
document.write(
Parent.nodeName
+"<br />");
//
Get the name parent node
document.write("The first child of the parent node is: ");
5
document.write(
Child.nodeName
+"<br />");
document.write("The node below the child is: ");
6
document.write(
Child.childNodes[0].nodeName
+"<br />");
document.write("The text node below title is: ");
7
document.write(
Child.childNodes[0].childNodes[0].nodeName
+
"<br />");
document.write("The value of the text node is: " +
8
Child.childNodes[0].childNodes[0].
nodeValue
+"<br />");
document.write("The first child of the parent is: ");
9
document.write(Parent.
firstChild.nodeName
+"<br />");
document.write("The last child of the parent is: ");
10
document.write(Parent.
lastChild.nodeName
+"<br />");
document.write("The node below the body is: ");
11
document.write(Parent.lastChild.childNodes[0].nodeName+
"<br />");
document.write("The next sibling of the h1 element is: ");
12
document.write(Parent.lastChild.childNodes[0].
nextSibling.nodeName
+
"<br />");
document.write("It's value is " +
"Parent.lastChild.childNodes[0].
nextSibling.nodeValue
);
13 document.write("<br />The last child's type is: ");
document.write(Parent.
lastChild.nodeType
);
</script>
</p>
</body>
</html>
EXPLANATION
1
The JavaScript program will access the HTML elements through the DOM
where each element is viewed as a node. This line cannot be broken for format-
ting due to the
whitespace bug
. If you break up this line, the whitespace created
will be considered a text node, and the rest of the script will not display the
nodes as expected.
Continues
