Maison > interface Web > js tutoriel > le corps du texte

Comment déterminer la hauteur div en JavaScript simple ?

Susan Sarandon
Libérer: 2024-11-05 17:53:02
original
559 Les gens l'ont consulté

How to Determine Div Height in Plain JavaScript?

Détermination de la hauteur d'un div en JavaScript simple

Accéder à la hauteur d'un élément div est essentiel pour les mises en page réactives et la manipulation dynamique des pages. Cependant, s'appuyer sur la méthode .height() de jQuery n'est pas toujours réalisable. Voici deux méthodes pour obtenir la hauteur d'un div sans avoir besoin de jQuery.

1. Hauteur du client :

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

La propriété clientHeight renvoie la hauteur de l'élément div, y compris le remplissage mais à l'exclusion des bordures et des barres de défilement. Ceci est utile pour obtenir la hauteur visible du div.

2. Hauteur de décalage :

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

La propriété offsetHeight renvoie la hauteur de l'élément div, y compris le remplissage, les bordures et les barres de défilement. Ceci est utile lorsque vous devez prendre en compte la hauteur totale occupée par le div sur la page.

Lorsque vous choisissez entre clientHeight et offsetHeight, tenez compte du contexte de votre application. Par exemple, si vous êtes intéressé uniquement par la hauteur visible du div, clientHeight est suffisant. Cependant, si vous devez tenir compte des bordures ou des barres de défilement, offsetHeight est l'option préféré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
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!