Hozzáférés elemek dom
Beépített tulajdonságok és módszerek a dokumentum objektum segítségével megtalálja bármely elemét az oldalon, és rávenni, hogy a szükséges intézkedéseket. Például minden elemnek style tulajdonság. amely lehetővé teszi, hogy módosítsa az elem CSS-stílusokat.
Felső szintű elemek
Az elemek a felső szinten is közvetlenül elérhető a tulajdonságok használatával a tárgy dokumentum:
- document.documentElement - utal az elem .
- document.head - utal az elem .
- document.body - utal az elem .
Az elemek az oldal nem érhető el, mielőtt megjelennek a böngészőben.
DOM-dokumentum szerkezetét jön létre, mint a kiadási oldal a képernyőre. Ha az elem nem jelenik meg a böngészőben, így nincs jelen a DOM fában. Ennélfogva lehetetlen alkalmazni ezt az elemet. nem történik semmi, ha fut a következő szkriptet:
Ez annak a ténynek köszönhető, hogy abban az időben a program futása elem
Ez nem létezik.A script kell kezdeni csak a kimeneti változó elem a képernyőn.
Tételek keresése
Utalni bármely elemét az oldalon DOM felület speciális keresési módszereket vezetnek be. A keresés végezhető különböző paraméterek szerint az elemek, így a segítségével ezeket megtalálja minden elemet.
getElementById ()
Object dokumentum egy integrált módszerrel getElementById (). Ő megkeresi az elemhez annak egyedi azonosító id.
document.getElementById (id) id tartalmazó karakterlánc egy egyedi azonosítót.
Lorem ipsum dolor.
Deleniti sit veniam.
Lorem ipsum dolor.
Deleniti sit veniam.
Kezelés A globális változók vezethet hibák a programban. Több helyes használata document.getElementById ().
Ez a módszer nagyon gyors, mivel a böngésző is kapcsolatot teremt az elemeket egy id attribútumot.
Kereséséhez id megfelelően működjön, az ID igazán egyedinek kell lennie. A dokumentum nem lehet több eleme azonos id.
getElementsByName ()
Object dokumentum egy integrált módszerrel getElementsByName (). A keresés folyik minden elemét az oldal a megadott attribútum neve. A módszer ad egy listát az összes elem, amelynek a nevét attribútum eleget tesz a kérésnek.
document.getElementsByName (név) nevet tartalmazó karakterlánc elem nevét (name attribútum).
Lorem ipsum dolor.
Deleniti sit veniam.
Az így kapott lista automatikusan frissül, ha megváltoztatja az oldal tartalmát.
getElementsByTagName ()
Bármely elem az oldal getElementsByTagName () módszer áll rendelkezésre. Ez a módszer keresést hajt végre a címkét. Amikor ez az úgynevezett keresés folyik belül ez az elem. A metódus visszaadja egy listát az összes olyan elemet, amely eleget tesznek a kérésnek.
elem. getElementsByTagName (tag) címke húr nevét tartalmazó címke.
A keresési lekérdezés betűk nem számít. Ha a kérelmet át a csillaggal. akkor a módszer visszaadja az összes leszármazottai az adott elem.
Lorem ipsum dolor.
Deleniti sit veniam.
Az így kapott lista automatikusan frissül, ha megváltoztatja az oldal tartalmát.
getElementsByClassName ()
Bármely elem az oldal getElementsByClassName () módszer áll rendelkezésre. Ez a módszer keres egy globális tulajdonság osztályban. Amikor ez az úgynevezett keresés folyik belül ez az elem. A módszer ad egy listát az összes elem a megadott osztályban.
elem. getElementsByClassName (class) osztály tartalmazó karakterlánc osztály nevét.
Lorem ipsum dolor.
Deleniti sit veniam.
Az így kapott lista automatikusan frissül, ha megváltoztatja az oldal tartalmát.
querySelectorAll ()
Bármely elem az oldal querySelectorAll () módszer áll rendelkezésre. A metódus visszaadja egy listát az összes olyan elemet, amely kielégíti a megadott CSS-választó. Amikor ez az úgynevezett keresés folyik belül ez az elem.
elem. querySelectorAll (választó) választó tartalmazó karakterlánc CSS-választó.
Lorem ipsum dolor.
Deleniti sit veniam.
Ez a módszer a leggyakoribb, mivel ezek helyettesíthető bármely a fenti módszerek.
Ez a módszer egy nagy teljesítményű, de a kapott lista nem frissül, ha megváltoztatja az oldal tartalmát.
querySelector ()
Bármely elem az oldal querySelector () módszer áll rendelkezésre. A módszer visszaadja az első eleme, amely megfelel a megadott CSS-választó. Amikor ez az úgynevezett keresés folyik belül ez az elem.
elem. querySelector (választó) választó tartalmazó karakterlánc CSS-választó.
A fő előnye ennek a módszernek tekintetében querySelectorAll (), hogy megáll, amikor az első mérkőzés. Ez lehetővé teszi, hogy a termelékenység növelése. Például, ha egyértelműen ismert, hogy az eredmény áll egy elem, akkor jobb, ha ezt a módszert használja.
Lorem ipsum dolor.
Deleniti sit veniam.
Bármely elem a lap legközelebb () módszer áll rendelkezésre. Ahogy querySelector (). módszer visszaadja az első eleme, amely megfelel a megadott CSS-választó. De a keresés nem az elemek belsejébe, és fordítva - akár a DOM hierarchiában. Ebben az esetben az elem, amelyre a módszert nevezik, szintén részt vesz az ellenőrzésben.
elem. legközelebb (választó) választó tartalmazó karakterlánc CSS-választó.
Az elv a módszer a következő:
- Először ellenőrizze az elem is, amelyen az eljárás meghívásakor.
- További ellenőrzött szülő ennek az elemnek. Ezután a nagyszülők, és így tovább.
- A módszer megáll az első elemet, és visszaadja az eredményt.