javascript

Chapter 10: The Document Object Model
This works in all browsers except IE, which throws an error because a NodeList is implemented as a
COM object and thus cannot be used where a JScript object is necessary. To convert a NodeList to an
array in IE, you must manually iterate over the members. The following function works in all browsers:
function convertToArray(nodes){
var array = null;
try {
array = Array.prototype.slice.call(nodes, 0); //non-IE
} catch (ex) {
array = new Array();
for (var i=0, len=nodes.length; i < len; i++){
array.push(nodes[i]);
}
}
}
return array;
The convertToArray() function first attempts to use the easiest manner of creating an array. If that
throws an error (which it will in IE), the error is caught by the try - catch block and the array is created
manually. This is another form of quirks detection.
Each node has a parentNode property pointing to its parent in the document tree. All nodes contained
within a childNodes list have the same parent, so each of their parentNode properties points to the
same node. Additionally, each node within a childNodes list is considered to be a sibling of the other
nodes in the same list. It ’ s possible to navigate from one node in the list to another by using the
previousSibling and nextSibling properties. The first node in the list has null for the value
of its previousSibling property, and the last node in the list has null for the value of its nextSibling
property, as shown in the following example:
if (someNode.nextSibling === null){
alert(“Last node in the parent’s childNodes list.”);
} else if (someNode.previousSibling === null){
alert(“First node in the parent’s childNodes list.”);
}
Note that if there ’ s only one child node, both nextSibling and previousSibling will be null .
Another relationship exists between a parent node and its first and last child nodes. The firstChild
and lastChild properties point to the first and last node in the childNodes list, respectively. The value
of someNode.firstChild is always equal to someNode.childNodes[0], and the value of someNode
.lastChild is always equal to someNode.childNodes[someNode.childNodes.length - 1] . If there
is only one child node, firstChild and lastChild point to the same node; if there are no children,
then firstChild and lastChild are both null . All of these relationships help to navigate easily
between nodes in a document structure. Figure 10 - 2 illustrates these relationships.
265