Obtener la altura de los elementos ocultos en jQuery

Cuando se trata de elementos ocultos, recuperar su altura puede ser un desafío. El enfoque convencional de mostrar temporalmente el elemento para medir su altura y luego ocultarlo nuevamente parece ineficaz. ¿Existe una solución más óptima?

Enfoque jQuery 1.4.2

Aquí hay un ejemplo usando jQuery 1.4.2:

$select.show();
optionHeight = $firstOption.height(); // Obtain height after displaying the element
$select.hide();

Este método tiene la desventaja de cambiar la visibilidad del elemento, lo que puede causar efectos secundarios no deseados.

Hackear el estilo del elemento

Un enfoque alternativo es manipular el estilo del elemento para hacerlo invisible mientras se calcula su altura:

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 : "");