Méthode innerHeight

La méthode innerHeight permet d'obtenir et de modifier la hauteur d'un élément en tenant compte de ses marges intérieures. Il est important de se rappeler que nous obtiendrons la 'valeur calculée' de la hauteur (computed height). Des erreurs de calcul peuvent également survenir si l'utilisateur modifie les dimensions de la page, ou si l'élément ou son parent sont masqués. La valeur de la hauteur ne tient pas compte de l'épaisseur de la bordure de l'élément.

Syntaxe

Obtenir la hauteur de l'élément. Dans certains cas, les valeurs obtenues peuvent être fractionnaires :

$(sélecteur).innerHeight();

Pour modifier la hauteur de l'élément - on peut simplement passer un nombre (par exemple 400), auquel cas les unités de mesure seront des pixels, ou une chaîne de caractères, avec indication des unités de mesure (par exemple '10em') :

$(sélecteur).innerHeight(nouvelle valeur);

Nous pouvons également appliquer une fonction donnée à chaque élément dans le ensemble. Le premier paramètre de la fonction recevra l'index de l'élément dans le ensemble, et le deuxième paramètre - la valeur actuelle de la hauteur pour cet élément spécifique. this à l'intérieur de la fonction pointera vers l'élément courant. La valeur de la hauteur de l'élément deviendra celle que retourne la fonction :

$(sélecteur).innerHeight(function(index dans le ensemble, valeur actuelle de la hauteur));

Exemple

Comparons en affichant les informations sur la hauteur du paragraphe #test, obtenues par les méthodes height et innerHeight :

<p id="test">text</p>
<p id="out1"></p>
<p id="out2"></p>

p {
	margin: 10px;
	padding: 5px;
	border: 2px solid blue;
}

let h1 = $('#test').height();
let h2 = $('#test').innerHeight();

$('#out1').text(h1);
$('#out2').text(h2);

Nous verrons une différence de 10px, ce qui correspond à la somme de nos marges intérieures haute et basse.

Voir aussi

la méthode height,
qui permet d'obtenir et de modifier la hauteur d'un élément
la méthode outerHeight,
qui permet d'obtenir et de modifier la hauteur d'un élément, en tenant compte de ses marges et de sa bordure