The CBE Object TreeAll CrossBrowserElement objects are connected into a tree structure using property names from the DOM2 Node interface. This tree structure models the parent/child (nesting) relationships among the CrossBrowserElement objects. Read more about the CBE object model The following shows how to display the tree structure. They both utilize cbeTraverseTree(). var sTree; function printTree1() { sTree = ""; cbeTraverseTree('preorder', window.cbe, printTreeVF1); cbeGetElementById('f1').t1.value = sTree; } function printTreeVF1(node, level, branch) { for (var i=0; i < level*2; ++i) sTree += '.'; sTree += node.id + '\n'; return true; } Example 2 is the technique used by the Object Viewer page. var sTree; function printTree2() { sTree = ""; cbeTraverseTree('preorder', window.cbe, printTreeVF2); cbeGetElementById('f1').t1.value = sTree; } var levelFlag = new Array(); function printTreeVF2(node, level, branch) { levelFlag[level] = node.nextSibling ? true : false; for (var i=0; i < level-1; ++i) { if (levelFlag[i+1]) sTree += '| '; else sTree += ' '; } if (level) sTree += "|_"; sTree += node.id + "\n"; return true; } |