jquery .derecha y altura del elemento

Question

Puede parecer una pregunta trivial, pero me he encontrado con un problema al usar jQuery. Cuando trato de obtener la altura para un elemento dentro de una lista. Siempre me dan cero.

$(function() { 
    $('#my-elem').height() // Always gives me zero. 
}); 

Si pongo el código en un retraso con setTimeout() alrededor de la comprobación de la altura (digamos de .5s) entonces la altura se informa correctamente de nuevo a mí. Supongo que esto se debe a que los estilos aún no se han podido aplicar.

La única solución que he encontrado para este problema es usar un intervalo para sondear la altura del elemento hasta que se vuelva distinto de cero, pero esto me parece exagerado. ¿Hay una mejor manera?

Answer 1

El evento document.ready indica que el HTML DOM está listo para acceder a través de Javascript, pero eso no significa que los elementos ya hayan procesado.

De hecho, eso es todo el asunto detrás ready: es un medio para que pueda empezar la manipulación de documento HTML DOM sin tener que esperar a que la página termine de cargarse. Es seguro asumir que al document.ready, sus elementos aún no se muestran en la página.

Ahora, eso viene con una advertencia: si los elementos aún no se han procesado, ¿cómo puede saber el navegador/Javascript cuál es su altura de resolución? .height() puede dar cero en document.ready debido a esto. Probablemente sea mejor esperar hasta load en lugar de ready cuando se trata de extraer las dimensiones de la caja del diseño.