Comment obtenir efficacement la hauteur des éléments cachés dans jQuery ?

Obtenir la hauteur des éléments cachés dans jQuery

Lorsqu'il s'agit d'éléments cachés, récupérer leur hauteur peut être un défi. L’approche conventionnelle consistant à afficher temporairement l’élément pour mesurer sa hauteur puis à le masquer à nouveau semble inefficace. Existe-t-il une solution plus optimale ?

Approche jQuery 1.4.2

Voici un exemple utilisant jQuery 1.4.2 :

<code class="js">$select.show();
optionHeight = $firstOption.height(); // Obtain height after displaying the element
$select.hide();</code>

Cette méthode a l'inconvénient de modifier la visibilité de l'élément, ce qui peut provoquer des effets secondaires indésirables.

Pirater le style de l'élément

Une approche alternative consiste à manipuler le style de l'élément pour le rendre invisible lors du calcul de sa hauteur :

<code class="js">var previousCss = $("#myDiv").attr("style"); // Store the original style

// Set visibility to 'hidden' and display to 'block'
$("#myDiv").css({
    position: 'absolute', // Optional if the element is already absolute
    visibility: 'hidden',
    display: 'block'
});

optionHeight = $("#myDiv").height(); // Measure height with modified visibility

// Restore the original style
$("#myDiv").attr("style", previousCss ? previousCss : "");</code>

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!