Java Reference
In-Depth Information
figure 9-9  
You've hopefully made this example very transparent by adding several alerts to demonstrate where you
are along each section of the tree. You've also named the variables with their various elements, to give a
clearer idea of what is stored in each variable. (You could just as easily have named them a , b , c , d , and
e , so don't think you need to be bound by this naming convention.)
You start at the top of the script block by retrieving the whole document using the documentElement
property:
var htmlElement = document.documentElement;
The root element is the <html/> element, hence the name of your first variable. Now if you refer to your
tree, you'll see that the HTML element must have two child nodes: one containing the <head/> element
and the other containing the <body/> element. You start by moving to the <head/> element. You get
there using the firstChild property of the Node object, which contains your <html/> element. You use
your first alert to demonstrate that this is true:
alert(headingElement.tagName);
You r <body/> element is your next sibling across from the <head/> element, so you navigate across by
creating a variable that is the next sibling from the <head/> element:
if (headingElement.nextSibling.nodeType == 3) {
bodyElement = headingElement.nextSibling.nextSibling;
} else {
Search WWH ::




Custom Search