ParentNode#
Wstęp#
Interfejs ParentNode (podobnie jak ChildNode) jest abstrakcyjnym interfejsem, nie istnieje żaden obiekt typu ParentNode ani obiekt samego interfejsu w przestrzeni globalnej, dlatego w definicji Web IDL pojawia się specjalny atrybut rozszerzający [NoInterfaceObject]. Interfejs ten jest potocznie nazywany rodzicem węzłowym #.
Rodzic węzłowy skupia w swojej definicji kilka podstawowych metod i właściwości, które mogą być implementowane w innych interfejsach. Na dzień dzisiejszy będą to interfejsy:
Zgromadzenie wielu poleceń w jednym miejscu powoduje, że nie ma potrzeby dublowania tych samych opisów w innych miejscach specyfikacji. Warto zauważyć, że wszystkie polecenia rodzica węzłowego spełniają relację [rodzic] -> potomek (w tym dziecko), czyli odnoszą się do potomków lub dzieci w swoim rodzicu.
Właściwości ParentNode#
| Nazwa | Opis |
|---|---|
ParentNode.childElementCount | Zwraca liczbę całkowitą reprezentującą ilość wszystkich dzieci (będących elementami) należących do danego węzła. |
ParentNode.children | Zwraca kolekcję elementową ze wszystkimi dziećmi (będącymi elementami) należącymi do danego węzła. |
ParentNode.firstElementChild | Zwraca pierwsze dziecko (będące elementem) należące do danego węzła. |
ParentNode.lastElementChild | Zwraca ostatnie dziecko (będące elementem) należące do danego węzła. |
Metody ParentNode#
| Nazwa | Opis |
|---|---|
ParentNode.append() | Dodaje przekazane węzły i/lub łańcuchy znakowe za ostatnim dzieckiem danego węzła. |
ParentNode.getElementById() | Zwraca pierwszego potomka (będącego elementem) o określonym identyfikatorze należącego do danego węzła. |
ParentNode.prepend() | Dodaje przekazane węzły i/lub łańcuchy znakowe przed pierwszym dzieckiem danego węzła. |
ParentNode.querySelector() | Zwraca pierwszego potomka (będącego elementem) należącego do danego węzła i pasującego do przekazanego selektora absolutnego. |
ParentNode.querySelectorAll() | Zwraca kolekcję węzłową ze wszystkimi potomkami (będącymi elementami) należącymi do danego węzła i pasującymi do przekazanego selektora absolutnego. |
Szczegóły#
26 października 2013 roku w specyfikacji DOM4 utworzono dodatkowy interfejs NonElementParentNode, do którego przeniesiono metodę ParentNode.getElementById(). Zmiana została podyktowana koniecznością zachowania kompatybilności wstecznej, gdyż działanie niektórych bibliotek (głównie starszych wersji jQuery) opiera się na założeniu, że dowolny węzeł w drzewie węzłów, który posiada metodę ParentNode.getElementById() jest dokumentem, i próba jej udostępnienia w elementach powoduje zepsucie już utworzonego kodu (DOM - Bug 23860, DOM - Bug 23694, Mozilla - Bug 933193). W razie potrzeby można skorzystać z API selektorów.
Jest duże prawdopodobieństwo, że w przyszłości wszystko wróci do pierwotnej postaci (bez dodatkowego interfejsu). Na dzień dzisiejszy nie tworzę osobnej strony opisującej kolejny interfejs, informuję jedynie, że taka zmiana miała miejsce. Jeśli sytuacja utrzyma się przez dłuższy czas i nie będzie żadnej szansy przywrócenia poprzedniego stanu, to dokonam stosownych korekt w kursie. Wszystkie aktualne przeglądarki internetowe działają zgodnie z bieżącymi wymaganiami specyfikacji DOM4.
Prosty przykład:
<script>
document.write(document.getElementById); // function getElementById() { [native code] }
document.write("<br>");
document.write(document.createDocumentFragment().getElementById); // function getElementById() { [native code] }
document.write("<br>");
document.write(document.documentElement.getElementById); // undefined
</script>Składnia Web IDL#
[NoInterfaceObject] interface ParentNode # { [SameObject] readonly attribute HTMLCollection children; readonly attribute Element? firstElementChild; readonly attribute Element? lastElementChild; readonly attribute unsigned long childElementCount; Element? getElementById(DOMString elementId); [Unscopable] void prepend((Node or DOMString)... nodes); [Unscopable] void append((Node or DOMString)... nodes); Element? query(DOMString relativeSelectors); [NewObject, Unscopable] Elements queryAll(DOMString relativeSelectors); Element? querySelector(DOMString selectors); [NewObject] NodeList querySelectorAll(DOMString selectors); }; Document implements ParentNode; DocumentFragment implements ParentNode; Element implements ParentNode;