Java Reference
In-Depth Information
else
{
bodyElement = headingElement.nextSibling;
}
alert(bodyElement.tagName);
Here you check to see what the
nodeType
of the
nextSibling
of
headingElement
is. If it returns
3
, (remember that
nodeType
3
is a text node), you set
bodyElement
to be the
nextSibling
of the
nextSibling
of
headingElement
; otherwise you just set it to be the
nextSibling
of
headingElement
.
You use an alert to prove that you are now at the <body/> element.
alert(bodyElement.tagName);
The
<body/>
element in this page also has two children, the
<h1/>
and
<p/>
elements. Using the
firstChild
property, you move down to the
<h1/>
element. Again you check whether the child node
is whitespace for non-IE browsers. You use an alert again to show that you have arrived at
<h1/>
.
if (bodyElement.firstChild.nodeType == 3)
{
h1Element = bodyElement.firstChild.nextSibling;
}
else
{
h1Element = bodyElement.firstChild;
}
alert(h1Element.tagName);
After the third alert, the style will be altered on your fi rst element, changing the font to Arial.
h1Element.style.fontFamily = “Arial”;
You then navigate across to the
<p/>
element using the
nextSibling
property, again checking for
whitespace.
if (h1Element.nextSibling.nodeType == 3)
{
pElement = h1Element.nextSibling.nextSibling;
}
else
{
pElement = h1Element.nextSibling;
}
alert(pElement.tagName);
You change the <p/> element's font to Arial also.
pElement.style.fontFamily = “Arial”;