TreeWalker#
TreeWalker.root#
Właściwość root zwraca korzeń (węzeł) skojarzony z danym przemierzaczem drzewa. Właściwość jest tylko do odczytu.
Opis działania#
Samo wywołanie i poszczególne jego części najlepiej objaśnić na zapisie składniowym:
var walker_root = treeWalker.root;gdzie poszczególne człony oznaczają:
- walker_root - referencja do korzenia w przemierzaczu drzewa.
- treeWalker - przemierzacz drzewa będący obiektem kontekstu.
Korzeniem może być dowolny rodzaj węzła, jest on ustawiany bezpośrednio przy tworzeniu przemierzacza drzewa (pierwszy argumenty) za pomocą metody Document.createTreeWalker(), w żaden sposób nie zależy od przekazywanej maski bitowej (drugi argumenty) czy filtra (trzeci argument), i dodatkowo nigdy nie ulega zmianie.
Prosty przykład:
<script>
// Tworzymy nowego przemierzacza drzewa (maska bitowa oraz filtr są domyślne)
var walker1 = document.createTreeWalker(document);
// Tworzymy nowego przemierzacza drzewa (maska bitowa oraz filtr są domyślne)
var walker2 = document.createTreeWalker(document.documentElement);
// Tworzymy nowego przemierzacza drzewa (maska bitowa oraz filtr są domyślne)
var walker3 = document.createTreeWalker(document.createTextNode(""));
document.write(walker1.root); // [object HTMLDocument]
document.write("<br><br>");
document.write(walker2.root); // [object HTMLHtmlElement]
document.write("<br><br>");
document.write(walker3.root); // [object Text]
</script>W obiektach typu TreeWalker korzeń nie zawsze musi pełnić rolę ogranicznika przy przemieszczaniu między węzłami, jak miało to miejsce w obiektach NodeIterator. Jeśli bieżący węzeł należy do poddrzewa w korzeniu to możliwe jest przejście w górę jedynie do samego korzenia. Ale kiedy bieżący węzeł z jakiegoś powodu znajdzie się poza poddrzewem korzenia i następnie umieścimy go w innym drzewie węzłów, to możliwe będzie swobodne poruszanie się w górę, aż do ostatniego nadrzędnego węzła. W tym wypadku korzeń przemierzacza nie stanowi już żadnego ograniczenia, chyba że w jakiś sposób ponownie powrócimy do korzenia lub zawartych w nim węzłów (szczegóły).
Prosty przykład:
<div id="box">
<p>Pierwszy akapit.</p>
<P>Drugi akapit.</p>
<P>Trzeci akapit.</P>
</div>
<div id="box2">
</div>
<script>
var root = document.getElementById("box");
var new_parent = document.getElementById("box2")
// Tworzymy nowego przemierzacza drzewa (filtr jest domyślny)
var walker = document.createTreeWalker(root, NodeFilter.SHOW_ALL);
document.write(walker.root); // [object HTMLDivElement]
document.write("<br>");
document.write(walker.root.id); // box
document.write("<br>");
document.write(walker.parentNode()); // null (nie można przejść przed korzeń)
document.write("<br>");
document.write(walker.previousNode()); // null (nie można przejść przed korzeń)
document.write("<br><br>");
// Ustawiamy bieżący węzeł w przemierzaczu na pierwszy akapit
document.write(walker.nextNode()); // [object Text]
document.write("<br>");
document.write(walker.nextNode()); // [object HTMLParagraphElement]
document.write("<br>");
document.write(walker.currentNode.textContent); // Pierwszy akapit.
document.write("<br><br>");
// Usuwamy bieżący węzeł z korzenia i wstawiamy do nowego rodzica
new_parent.appendChild(root.removeChild(walker.currentNode));
// Kilkukrotnie zmieniamy bieżący węzeł w przemierzaczu
// Wybierane węzły znajdują się poza jego początkowym korzeniem 'root'
document.write(walker.parentNode()); // [object HTMLDivElement]
document.write("<br>");
document.write(walker.currentNode.id); // box2
document.write("<br>");
document.write(walker.parentNode()); // [object HTMLBodyElement]
document.write("<br>");
document.write(walker.previousNode()); // [object HTMLHeadElement]
</script>Składnia Web IDL#
interface TreeWalker { [SameObject] readonly attribute Node root; }