Heim >Web-Frontend >js-Tutorial >Wie erhalte ich die Höhe eines Divs in reinem JavaScript?

Wie erhalte ich die Höhe eines Divs in reinem JavaScript?

Barbara Streisand
Barbara StreisandOriginal
2024-11-04 21:17:02619Durchsuche

How to Get a Div's Height in Pure JavaScript?

So bestimmen Sie die Höhe eines Div in einfachem JavaScript

Abfrage:

Viele Entwickler verlassen sich auf die .height()-Methode von jQuery, um die Höhe eines Div abzurufen. Ist es jedoch möglich, dies ohne die Verwendung von jQuery zu erreichen?

Lösung:

Ja, es ist möglich, die Höhe eines Divs mit einfachem JavaScript zu bestimmen. Hier sind zwei Methoden:

  1. clientHeight-Eigenschaft:
<code class="javascript">var clientHeight = document.getElementById('myDiv').clientHeight;</code>

Diese Eigenschaft gibt die Höhe des Div zurück, einschließlich seiner Auffüllung, aber ohne seine Bildlaufleiste und Ränder.

  1. offsetHeight-Eigenschaft:
<code class="javascript">var offsetHeight = document.getElementById('myDiv').offsetHeight;</code>

Im Gegensatz zu clientHeight umfasst offsetHeight nicht nur die Auffüllung, sondern auch die Bildlaufleiste und die Ränder, wenn vorhanden.

Auswahl der geeigneten Eigenschaft:

Die Wahl zwischen clientHeight und offsetHeight hängt von den spezifischen Anforderungen ab. Wenn Sie die Höhe des Div ohne Bildlaufleisten und Rahmen benötigen, ist clientHeight geeignet. Für Fälle, in denen Sie die Gesamthöhe einschließlich dieser Elemente benötigen, ist offsetHeight die geeignete Option.

Das obige ist der detaillierte Inhalt vonWie erhalte ich die Höhe eines Divs in reinem JavaScript?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn