Maison > interface Web > js tutoriel > Comment obtenir la hauteur d'une division en JavaScript pur ?

Comment obtenir la hauteur d'une division en JavaScript pur ?

Barbara Streisand
Libérer: 2024-11-04 21:17:02
original
605 Les gens l'ont consulté

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

Comment déterminer la hauteur d'un div en JavaScript simple

Requête :

Beaucoup les développeurs s'appuient sur la méthode .height() de jQuery pour récupérer la hauteur d'un div. Cependant, est-il possible d'y parvenir sans utiliser jQuery ?

Solution :

Oui, il est possible de déterminer la hauteur d'un div en utilisant du JavaScript simple. Voici deux méthodes :

  1. propriété clientHeight :
<code class="javascript">var clientHeight = document.getElementById('myDiv').clientHeight;</code>
Copier après la connexion

Cette propriété renvoie la hauteur du div, y compris son remplissage mais à l'exclusion de son barre de défilement et bordures.

  1. Propriété offsetHeight :
<code class="javascript">var offsetHeight = document.getElementById('myDiv').offsetHeight;</code>
Copier après la connexion

Contrairement à clientHeight, offsetHeight inclut non seulement le remplissage mais également la barre de défilement et les bordures si présent.

Choisir la propriété appropriée :

Le choix entre clientHeight et offsetHeight dépend des exigences spécifiques. Si vous avez besoin de la hauteur du div sans barres de défilement ni bordures, clientHeight convient. Pour les cas où vous avez besoin de la hauteur totale incluant ces éléments, offsetHeight est l'option appropriée.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Derniers articles par auteur
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal