HTML-DOM offsetHeight -Eigenschaft
Element-ObjektBeispiel
Ruft die Höhe eines div-Elements ab, einschließlich Padding und Rahmen:
Selbst ausprobieren »
Definition und Verwendung
Die offsetHeight-Eigenschaft ist eine schreibgeschützte Eigenschaft, die die Pixelhöhe des Elements zurückgibt, einschließlich Padding und Border, ohne Margin, als ganze Zahl in Pixeln px.
Im Allgemeinen ist der offsetHeight eines Elements ein Maß für die CSS-Höhe des Elements, einschließlich Border, Padding und horizontaler Bildlaufleiste (falls vorhanden und gerendert), aber ohne:beforeoder:afterdie Höhe von Pseudo-Elementen usw.
Für das body-Objekt des Dokuments enthält sie die lineare Gesamthöhe des Inhalts anstelle der CSS-Höhe des Elements. Die Höhe von Inhalten, die sich von schwebenden Elementen nach unten erstrecken, wird ignoriert.
Wenn das Element ausgeblendet ist (zum Beispiel, wenn bei dem Element oder einem seiner Vorfahren-Elementestyle.displayaufnonegesetzt ist), wird 0 zurückgegeben.
Hinweis:Um diese Eigenschaft zu verstehen, sieheCSS-Box-Modell。
Tipp:Diese Eigenschaft wird normalerweise zusammen mit deroffsetWidth-Eigenschaft verwendet.
Tipp:Verwenden Sie die clientHeightundclientWidth-Eigenschaft, um die sichtbare Höhe und Breite des Elements zurückzugeben, wobei nur Padding enthalten ist.
Tipp:Um dem Element eine Bildlaufleiste hinzuzufügen, können Sie dieoverflow-Eigenschaft verwenden.
Dies ist eine schreibgeschützte Eigenschaft.
Browser-Unterstützung
| Eigenschaft | |||||
|---|---|---|---|---|---|
| offsetHeight | Ja | Ja | Ja | Ja | Ja |
Syntax
element.offsetHeight
Technische Details
| Rückgabewert: | Gibt eine ganze Zahl zurück, die die Pixelhöhe des Elements darstellt. |
|---|
Weitere Beispiele
Beispiel
Das folgende Beispiel zeigt den Unterschied zwischen den Eigenschaften clientHeight/clientWidth und offsetHeight/offsetWidth:
Selbst ausprobieren »
Beispiel
Das folgende Beispiel zeigt den Unterschied zwischen den Eigenschaften clientHeight/clientWidth und offsetHeight/offsetWidth, nachdem dem Element eine Bildlaufleiste hinzugefügt wurde:
Selbst ausprobieren »
Andere Erweiterungen