Naršykite DOM medyje
Kaip minėjome, navigaciją galima atlikti per hierarchinę struktūrą, vizualizuojančią schemą kaip medį, tokiu būdu mes galime traktuoti elementus kaip tėvus, vaikus, brolius ir seseris.
Tokiu būdu elemento galima ieškoti vadovaujantis paieškos pagal santykius filosofija.
Prieš pereidami prie praktinių programų, pažiūrėkime galimus metodus:
· vaiko mazgai: Grąžina visus pirminio elemento antrinius elementus.
· pirmas vaikas: Grąžina elementą, kuris yra pirmasis pirminio elemento antrinis elementas.
· hasChildNodes (): Grąžina true arba true, jei dabartiniame elemente yra antrinių mazgų.
· Paskutinis vaikas: Grąžina paskutinį dokumento elemento antrinį elementą.
· kitasSibling: Grąžina brolio ir sesers elementą, apibrėžtą dabartiniu HTML elementu.
· parentNode: Grąžina dabartinio HTML elemento pirminį elementą.
· previousSibling: Grąžina brolio / sesers elementą prieš dabartinį HTML elementą.
Kai žinosime, kokius metodus turime, pamatysime paprastą kodo pavyzdį, su kuriuo suprasime, kas yra navigacija. DOM medis.PavyzdysYra daug įvairių vaisių - vien tik bananų yra daugiau nei 500 veislių. Kai pridėsime daugybę obuolių, apelsinų ir kitų gerai žinomų vaisių rūšių, susidursime su tūkstančiais pasirinkimų.
![]()
![]()
Vienas iš įdomiausių vaisių aspektų yra kiekvienoje šalyje prieinama įvairovė. Aš gyvenu netoli Londono, rajone, kuris yra žinomas dėl savo obuolių.
Tėvas Pirmasis vaikas Anksčiau Sesuo Kitas brolis
Šiuo kodu pasiekiama galimybė naršyti tarp elementų ir, kai jie nuspalvina juos šviesiai pilka spalva, kad būtų galima atskirti, kurioje dokumento dalyje mes esame, pažiūrėkime paveikslėlyje, kaip turėtume jį matyti savo naršyklėje:
Tuo baigėme šį vadovėlį, kuriame galėjome ieškoti elementų HTML dokumente, nesiremdami identifikatoriais ar elementų pavadinimais, tiesiog naudodami jų ryšį hierarchinėje struktūroje.Ar jums patiko ir padėjo ši pamoka?Galite apdovanoti autorių paspausdami šį mygtuką, kad suteiktumėte jam teigiamą tašką