Navigați în arborele DOM
După cum am menționat, navigarea se poate face prin structura ierarhică vizualizând schema ca un copac, în acest fel putem trata elementele ca părinți, copii, frați.
Cu aceasta, căutarea unui element se poate face urmând filosofia unei căutări după relație.
Să vedem metodele disponibile înainte de a trece la aplicațiile practice:
· childNodes: Returnează toate elementele copil ale elementului părinte.
· primul copil: Returnează elementul care este primul copil al unui element părinte.
· hasChildNodes (): Returnează adevărat sau adevărat dacă elementul curent are noduri copil.
· ultimul copil: Returnează ultimul copil al unui element din document.
· următorul frate: Returnează elementul frate definit de elementul HTML curent.
· parentNode: Returnează elementul părinte al elementului HTML curent.
· precedentSibling: Returnează elementul frate înaintea elementului HTML curent.
Odată ce știm ce metode avem disponibile, vom vedea un exemplu simplu de cod cu care vom înțelege despre ce este navigarea prin el. Copac DOM.ExempluExistă o mulțime de feluri diferite de fructe - există peste 500 de soiuri de banane numai. Până când adăugăm nenumăratele tipuri de mere, portocale și alte fructe cunoscute, ne confruntăm cu mii de alegeri.
Unul dintre cele mai interesante aspecte ale fructelor este varietatea disponibilă în fiecare țară. Locuiesc lângă Londra, într-o zonă cunoscută pentru merele sale.
Părintele Primul copil Anterior Frate Următorul frate
Ceea ce realizează acest cod este să putem naviga între elemente și odată ce le umbrește în gri deschis pentru a putea diferenția în ce parte a documentului suntem, să vedem în imagine cum ar trebui să îl vedem în browserul nostru:
Cu aceasta am terminat acest tutorial, unde am putut căuta elemente într-un document HTML fără a ne baza pe identificatori sau nume de elemente, folosind pur și simplu relația lor în structura ierarhică.V-a plăcut și ați ajutat acest tutorial?Puteți recompensa autorul apăsând acest buton pentru a-i oferi un punct pozitiv
