Tento príspevok vysvetľuje vlastnosť prvku HTML DOM „previousElementSibling“ pomocou JavaScriptu.
Čo je vlastnosť prvku HTML DOM „previousElementSibling“?
Element DOM (Document Object Model) “ predchádzajúciPrvokSúrodenec ” je vlastnosť len na čítanie, ktorá pomáha získať predchádzajúceho súrodenca prvku v rovnakom strome. Táto vlastnosť vracia obsah predchádzajúceho súrodenca.
Syntax
element. predchádzajúciPrvokSúrodenec
Táto syntax vráti „ reťazec “ obsahujúci obsah HTML predchádzajúceho súrodenca a “ nulový “ ak neexistuje.
Využime vyššie definovanú syntax prakticky na ukážku fungovania vlastnosti „previousElementSibling“.
Príklad: Použitie vlastnosti „previousElementSibling“ na vrátenie obsahu predchádzajúceho súrodenca
V tomto príklade sa použije vlastnosť jazyka JavaScript „previousElementSibling“ na získanie obsahu HTML predchádzajúceho súrodenca.
HTML kód
Najprv prehľad nasledujúceho kódu HTML:
< ul >< že id = 'najprv' > HTML < / že >
< že id = 'druhý' > CSS < / že >
< že id = 'tretí' > JavaScript < / že >
< / ul >
< p id = 'pre' < / p >
Vo vyššie uvedených riadkoch kódu:
- '
- Vo vnútri nezoradeného zoznamu je viacero položiek vložených pomocou „
” s priradenými ID. - Nakoniec, „ ” tag vloží prázdny odsek s jedinečným ID “para”.
JavaScript kód
Teraz pokračujte kódom JavaScript:
< skript >nechať položku = dokument. getElementById ( 'tretí' ) . predchádzajúciPrvokSúrodenec . innerHTML ;
dokument. getElementById ( 'pre' ) . innerHTML = ' Predchádzajúci súrodenec tretej položky je : ' + položka ;
skript >
Podľa vyššie uvedeného útržku kódu:
- Premenná „item“ najskôr používa „ getElementById() “ na prístup k zacielenej položke zoznamu pomocou jej ID „tretie“ a potom použite „ predchádzajúciPrvokSúrodenec ” majetok získať svojho predchádzajúceho súrodenca.
- Potom sa „ getElementById() Metóda ” pristupuje k pridanému prázdnemu odseku pomocou svojho id „para“, aby k nemu pridala hodnotu premennej „item“, t. j. predchádzajúci súrodenec.
Výkon
Ako vidíte, výsledok zobrazuje predchádzajúceho súrodenca zacielenej položky, t. j. (JavaScript).
Záver
JavaScript poskytuje preddefinovaný prvok DOM “ predchádzajúciPrvokSúrodenec vlastnosť na získanie predchádzajúceho súrodenca prvku. Vráti predchádzajúceho súrodenca prvku z rovnakej stromovej úrovne, kde leží cieľový prvok. Tento príspevok podrobne vysvetlil vlastnosť prvku HTML DOM „previousElementSibling“ v jazyku JavaScript.