Working with Document Nodes and Styles - HTML, CSS, and Dynamic HTML - page 1003

object itself is hidden. The following function provides code for moving up the object
hierarchy in this way:

function isHidden(object) {
for (var n = object; n.nodeName != “BODY”; n = n.parentNode) {
if (n.style.display == “none”) return true;
}
return false;
}
The isHidden() function starts with the current object and, using the parentNode prop-
erty, moves up the object tree until it reaches the body element. At each step along the
way, the function tests the value of the display property of the current node in the
loop. If the display style is none , the function immediately returns true , indicating that
the object is hidden. On the other hand, if the browser goes all the way up the object
hierarchy without encountering one hidden parent, the object itself is not hidden and the
function returns false .
You'll add the isHidden() function now.

To insert the isHidden() function:

◗

1. Directly below the expandCollapseDoc() function, insert the following code, as
shown in Figure 14-54:

function isHidden(object) {
/* Move up the node tree from object, return true if a
hidden parent node is found, return false if all parent
nodes are unhidden */
for (var n = object; n.nodeName != “BODY”; n = n.parentNode) {
if (n.style.display == “none”) return true;
}

return false;
}

Figure 14-54 inserting the ishidden() function

◗ 2. Save your changes to the file.

You'll use the isHidden() function to determine the display status of any entry in the
table of contents. Recall that in the previous session, each entry was given an id based
on the id of a corresponding heading in the source document. If a heading has the id
sectionId , then the corresponding list item has the id TOC sectionId . You can use the
getElementById() method to locate the list item for each element node as follows:

var TOCentry = document.getElementById(“TOC” + n.id);