IteratorView is an interactive UI sample that displays the DOM tree. It
shows the progress of the iteration by moving the selection within the DOM tree.
Buttons act as a control panel, allowing the user to interactively iterate through
the tree, remove nodes, add nodes, and view the results immediately in the tree.
IteratorView uses an example filter,
NameNodeFilter, that can be controlled
from the UI and a
DOMTreeFull class that displays the full DOM tree with all
The controls are called through to to the corresponding iterator function. If you
are familiar with the DOM Level 2 Traversal specification, these controls are
fairly easy to understand
- Next - calls the
next() functions and selects the next node in the tree.
- Previous - calls the
previous() function and selects the previous node in
remove - remove the selected Node and update the DOM tree. You
must press an iterator button to see next or previous node selection.
add - add a text node, to see the results of adding a node on the iterator.
position. Again you must first press next or previous
createNodeIterator - calls the factory method to create a new iterator
with the corresponding
- The root is set to be the root of the document, so it
starts at the top level each time.
whatToShow - you can singly or multiply select values and the
iterator is constrained to showing these types.
NodeNameFilter - An empty string is converted to null and given
- An empty string matches all nodes.
- A non-empty string is forced to match node names.