↑
Main Page

new Object

var walker = null;

function makeList() {

var oDiv = document.getElementById(“div1”);

var oFilter = new Object;

oFilter.acceptNode = function (oNode) {

return (oNode.tagName == “P”) ?

NodeFilter.FILTER_REJECT : NodeFilter.FILTER_ACCEPT;

};

walker = document.createTreeWalker(oDiv, NodeFilter.SHOW_ELEMENT,

oFilter, false);

var oOutput = document.getElementById(“text1”);

var oNode = walker.nextNode();

while (oNode) {

oOutput.value += oNode.tagName + “\n”;

oNode = walker.nextNode();

}

</script>

</head>

<body>

<p>Hello <b>World!</b></p>

<ul>

</ul>

</div>

</html>

Naturally, the true power of a

TreeWalker

is lost on a simple example such as this; it is much more use-

ful in cases when you don’t want to go straight through the entire DOM tree. For example, suppose you

only want to visit the

<li/>

elements in the HTML page shown previously. You could write a filter that

only accepts elements with the tagName

“LI”

, or you could use a

TreeWalker

to do a purposive

traversal:

<html>

<head>

<title>TreeWalker Example</title>

var walker = null;

function makeList() {

var oDiv = document.getElementById(“div1”);

walker = document.createTreeWalker(oDiv, NodeFilter.SHOW_ELEMENT,

null, false);

188

Chapter 6

09_579088 ch06.qxd 3/28/05 11:37 AM Page 188