Tento zápis podrobně popisuje fungování vlastnosti „offsetTop“ v JavaScriptu.
Jak funguje vlastnost HTML DOM „offsetTop“ v JavaScriptu?
' offsetTop Vlastnost ” funguje na elementech HTML a vrací také „margin“, horní „padding“, „border“ a „scrollbar“ svého nadřazeného prvku.
Syntax
živel. offsetTop
V této syntaxi „ živel ” označuje horní pozici konkrétního prvku HTML vzhledem k výřezu (prázdná oblast, kde se zobrazuje obsah webové stránky).
Poznámka: Vrácená hodnota zahrnuje následující:
- horní pozice a okraj prvku.
- horní okraj, posuvník a odsazení nadřazeného prvku.
Použijme výše uvedenou syntaxi prakticky.
Příklad: Použití vlastnosti „offsetTop“ k vyhodnocení nejvyšší pozice HTML
Tento příklad využívá „ offsetTop ” vlastnost pro výpočet nejvyšší pozice konkrétního HTML elementu, tj., “ Nejprve si projděte následující HTML kód: Ve výše uvedeném kódu: Nyní zvažte daný kód JavaScript: Ve výše uvedených řádcích kódu: Výstup V tomto výsledku lze pozorovat, že horní pozice daného divu (včetně marginu), tj. 35 pixelů “ se vypočítá v souladu se zadanou poznámkou (na začátku blogu) a zobrazí se po kliknutí na tlačítko. JavaScript poskytuje „ offsetTop ” pro výpočet horní pozice elementu HTML vzhledem k výřezu. Vrátí vypočítanou horní pozici prvku jako celočíselnou hodnotu v „ pixelů “. Tento zápis demonstroval cíl, použití a implementaci vlastnosti „offsetTop“ prvku HTML DOM v JavaScriptu.
HTML kód
< b > Detaily tento div jsou : b < br >
horní : 20 pixelů < br >
pozice : relativní < br >
text - zarovnat : centrum < br >
okraj : 15 pixelů < br >
okraj : 3px < br >
div < br >
< tlačítko onclick = 'jsFunc()' > Klikněte na něj knoflík >
< p id = 'pro' > p >
JavaScript kód
funkce jsFunc ( ) {
byl elmnt = dokument. getElementById ( 'Div1' ) ;
kde txt = 'Vypočítaný OffsetTop je: ' + elmnt. offsetTop + 'px
' ;
dokument. getElementById ( 'pro' ) . vnitřní HTML = txt ;
}
skript >
Závěr