2012-09-26 13 views
15

¿Hay alguna manera de ejecutar el código jQuery antes de que DOM esté listo?¿Está ejecutando el código jQuery antes de que DOM esté listo?

+1

Sí. Pero algunas partes que interactúan con el DOM no funcionarán. –

+2

Sí, sí lo hay, pero dado que jQuery está destinado principalmente a modificar el DOM, ¿por qué quieres hacerlo? –

+0

see :: http://stackoverflow.com/questions/4124765/how-to-load-jquery-before-dom-is-ready –

Respuesta

16

jQuery es solo Javascript, entonces la pregunta es realmente "¿Es posible ejecutar JavaScript antes de que el DOM esté listo?" Y con eso supongo que quiere decir el documento y no el DOM.

Si podemos aceptar que la pregunta es "¿Es posible ejecutar JavaScript antes de que el documento esté listo?". Entonces la respuesta es sí. El JavaScript se ejecutará cuando se encuentre.

Es por eso que casi siempre se ve bien o $(document).ready(function(){...}) porque la mayoría del código de jQuery requiere el documento para estar listo pero el código de fijar el controlador de eventos es, sin duda ejecutado antes de que el documento está listo (de lo contrario no sería capaz de manejar la evento listo para documentar).

Normalmente debe colocar su Javascript incluido en la parte inferior de su HTML, pero si desea que se ejecute anteriormente, simplemente puede colocarlo antes en el documento, p. en el encabezado

<html> 
    <head> 
    ... 
    <script> 
     //place your code to be executed early here 
    </script> 
    </head> 
... 
</html> 
3

Si incluye jQuery en la cabecera de su documento, y luego escribe el código en otra etiqueta de script en la cabeza, se ejecutará antes de que el DOM está listo:

<head> 
    <script src="jquery.js"></script> 
    <script> 
     // Do some stuff before the DOM is ready 
    </script> 
</head> 
<body> 
    <!-- Browser hasn't got this far, so no elements will be available --> 
</body> 

Sin embargo, es obvio que ganó' ser capaz de interactuar con cualquier elemento DOM, ya que aún no existirán.


Una vez dicho esto, hay es una técnica que se puede utilizar en los navegadores modernos que pueden permitir que le permite interactuar con los elementos DOM a medida que se insertan en la página (mientras que el navegador está haciéndolo). Se basa en CSS animation events. Escribí a simple library (Progressive.js) para que sea más fácil de manejar.

Cuestiones relacionadas