Comment puis-je obtenir efficacement la hauteur d'un élément dans une division cachée à l'aide de jQuery ?

Récupérer la hauteur des éléments cachés dans jQuery

Obtenir la hauteur d'un élément caché dans un div caché peut être un défi. La méthode conventionnelle consiste à afficher le div, à récupérer la hauteur, puis à la masquer, ce qui peut s'avérer fastidieux.

Cependant, il existe une approche plus efficace qui exploite la capacité de jQuery à modifier les styles CSS :

Approche

1. Modifier CSS : Définir temporairement les éléments suivants Propriétés CSS pour le div caché :

   • position : absolue (facultatif si le div est déjà absolu)
   • visibilité : cachée
   • affichage : bloquer
2. Obtenir la hauteur : À l'aide de la fonction height() de jQuery, récupérez la hauteur du élément dans le div désormais visible.
3. Restaurer CSS : Une fois la hauteur obtenue, restaurez les propriétés CSS d'origine du div.

Exemple de code

var previousCss = $("#myDiv").attr("style");

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

optionHeight = $("#myDiv").height();

$("#myDiv").attr("style", previousCss ? previousCss : "");

Cette approche offre un moyen plus efficace et plus flexible d'obtenir la hauteur des éléments cachés, sans avoir à afficher et masquer à plusieurs reprises le parent. div.

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!