Solución:
Puedes colocar a script en cualquier parte del documento. Las mejores prácticas generalmente recomiendan colocar scripts en el pie de página por problemas de rendimiento de carga de la página. Además, las mejores prácticas generalmente recomiendan colocar los scripts juntos para facilitar el mantenimiento.
Sin embargo, según la especificación, no hay restricciones sobre el lugar del documento en el que se coloca un script etiqueta. Puede colocarlos juntos en el encabezado, en la parte inferior del cuerpo, esparcidos por todo el documento o cualquier combinación de los mismos.
El uso de la construcción jQuery $(document).ready tiene el mismo resultado independientemente de dónde se coloque dentro del documento. La clave es comprender la funcionalidad detrás de esta construcción:
Si bien JavaScript proporciona el evento de carga para ejecutar código cuando se representa una página, este evento no se activa hasta que todos los activos, como las imágenes, se hayan recibido por completo.
Entonces, ready es parecido a document.onload, pero no lo mismo. No importa dónde esté el código, si lo ejecuta cuando document.onload se dispara o cuando jQuery dispara ready. La ubicación del código en un documento solo es significativa si NO está envuelto por algún controlador / oyente de eventos.
La única restricción sobre la ubicación en $(document).ready es que no puede suceder antes de incluir la biblioteca jQuery. $(document).ready está usando jQuery, por lo que si jQuery no existe … no puede usarlo.
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>
<script>
alert('executed as soon as it is reached (as the document is downloaded)');
$(document).ready(function () { alert('on jQuery ready'); });
</script>
</head>
<body onload="alert('executed on document.onload event');">
<script>
alert('executed as soon as it is reached (as the document is downloaded)');
$(document).ready(function () { alert('on jQuery ready'); });
</script>
</body>
</html>
Documentación
- Especificación de SCRIPT en W3: http://www.w3.org/TR/html401/interact/scripts.html
- Especificación de script (html 5) en W3 – http://www.w3.org/TR/html-markup/script.html
- Colocando Javascript en sus páginas en quirksmode – http://www.quirksmode.org/js/placejs.html
- Jquery
ready– http://api.jquery.com/ready/
HASTA DONDE SE, $(document).ready El evento se genera después de que DOM está completamente cargado, por lo que no importa dónde lo coloque.
Pero dicen que se escriba el script al final del cuerpo porque la página se mostrará al usuario final instantáneamente y JavaScript continuará ejecutándose como proceso en segundo plano.