link body javascript

body - ¿Tiene javascript en las etiquetas head?



meta html (11)

  1. Porque no desea que JavaScript se mezcle con HTML - contenido con comportamiento. Preferiblemente lo quieres en un archivo separado.

  2. Tener JS en otra parte tiene ventajas y desventajas: se ejecutará en diferentes momentos, por ejemplo, y puede escribir en el documento desde javascript ubicado en el cuerpo.

Creo que javascript puede estar en cualquier lugar (casi), pero casi siempre lo veo entre <head></head> . Estoy usando jquery y quería saber si tiene que estar en las etiquetas de cabeza por alguna razón o si se romperá algo si lo muevo. Gracias.

EDITAR: ¿Por qué casi siempre está en las etiquetas de la cabeza?


Básicamente, los navegadores dejan de mostrar la página hasta que los archivos .js se descargan y procesan por completo. Como renderizan la página de forma progresiva a medida que llega el HTML, los archivos .js posteriores se referencian, mejor será la experiencia del usuario.

Entonces, el truco consiste en incluir solamente scripts absolutamente cruciales en el head y cargar los restantes hacia el final de la página.


En algunos casos, sí, el script puede no funcionar si está en la ubicación incorrecta. Algunos JavaScript deben ejecutarse después de un elemento HTML específico, otros deben estar exactamente donde desea que se muestre el resultado del script, otros deben estar en la cabecera del documento. Realmente depende de cómo se escribe el código. Si no está seguro, debe ejecutar su código en window.load o DOMready: http://www.javascriptkit.com/dhtmltutors/domready.shtml


En realidad, por razones de rendimiento, casi siempre desea colocar las etiquetas de script en la parte inferior de la página. ¿Por qué? Desea que su estructura de página y su CSS se carguen primero para que el usuario vea la página de inmediato. Entonces quieres que todo tu código conducido por comportamiento se cargue al final. YSlow es una buena extensión de Firefox que te mostrará una calificación por rendimiento. Uno de los puntos en los que te califica es si tienes javascript en la parte inferior en lugar de la parte superior.


JavaScript se ejecuta donde sea que se encuentre en el documento. Si coloca JavaScript en línea en el cuerpo, se ejecutará cuando el navegador acceda a él. Si está usando $(document).ready(...) para ejecutar cosas, entonces el posicionamiento no debería importar. De lo contrario, puede encontrar casos de esquina donde sea importante. En general, no importa. Los guiones terminan en la etiqueta de la head su mayoría fuera de la tradición.



No. SCRIPT no solo se clasifica como elemento head.misc , sino también como elemento especial y, por lo tanto, está permitido en todas partes donde se permiten los elementos en línea . Así que puedes poner un SCRIPT donde estén permitidos los elementos en línea:

<p>foo <script>document.write("bar")</script></p>

De hecho, http://developer.yahoo.com/performance/rules.html#js_bottom justo antes de la etiqueta de cierre para que el documento completo se analice antes de cargar el JavaScript. Eso es para evitar que JavaScript bloquee descargas paralelas.


Puede ir en la etiqueta de head o body . Solo tenga en cuenta que se ejecutará siempre que se lea y no necesariamente cuando el documento esté terminado de cargarse. Echa un vistazo here .


Solo ten cuidado con los malos efectos en la latencia que puedes tener, dependiendo del navegador del usuario y dónde colocas exactamente tu Javascript en la página. Mira todo lo que Steve Souders tiene para decir, incluidos los videos de sus conferencias de Stanford. y el fruto de sus labores dejados atrás, por ejemplo, http://developer.yahoo.com/performance/rules.html#js_bottom (ponga las secuencias de comandos en la parte inferior de la página en la medida de lo posible, etc.).


Todo se detiene cuando el navegador lee una etiqueta de script hasta que la procesa. Por lo tanto, su página se procesará más rápido si mueve las etiquetas de script lo más lejos posible, idealmente justo antes de la etiqueta de cuerpo final. Obviamente, el tiempo de carga total será el mismo.

Deberá asegurarse de que no llame a ninguna función jQuery hasta que se incluya jQuery, por supuesto.


Y es por eso que JavaScript está en un lío y por qué las viejas publicaciones de son la peor pesadilla de un desarrollador. JS cambia tan rápido en estos días con un nuevo marco que sale cada semana y cada uno es reclamado por los defensores de las abejas.

Gumbo está en lo cierto al decir que una etiqueta de script puede referenciarse en cualquier lugar en el que un elemento en línea pueda, pero la opción de cargar un archivo JS externo o incluir código JS dentro de una etiqueta es una decisión individual en cada caso. Sí, el navegador se detendrá para cargar JS cuando lo analiza y, por lo tanto, debe considerar cómo afectará esto a la velocidad y funcionalidad de carga de la página. La actual o hace un año, mediados de 2015 (tenga en cuenta que la respuesta popualar fue en julio de 2009 y la mayoría de los desarrolladores nunca leerán esto mientras miran la respuesta no.1 y sigan adelante) es ese móvil dado la prioridad a la velocidad de carga de la página requiere un límite de dos solicitudes para el mástil móvil / celular que con 3G le da una carga útil de 28k (2x14kb (sí)), necesita considerar (como Google lo llama) "pintar a pantalla" de 28k esto debería proporcionar al usuario suficiente contenido / interactividad de la página para garantizar que estén en la página correcta o en la pista correcta, en esos 28k. Entonces, un Jquery minified es actualmente 87.6lkb, ¡simplemente no va a cortar la mostaza!

Esta es la razón por la que la carga de la mayoría de las páginas móviles permanece en reposo durante unos segundos antes de cargar cualquier cosa, ¡y eso es 4G! No lo hagas La velocidad de la página es el rey y los usuarios presionan el botón Atrás antes de que se cargue el archivo JQuery. En 3G + una carga útil de 28k se cargará en <1 segundo, por lo que no hay ninguna razón por la que su página no comience a cargarse en ese momento. La próxima vez que veas un enlace en tu teléfono, mira cómo se sienta el pequeño bar y espera mientras revisa todas las etiquetas de la página siguiente.

Así que estructure su página no en dónde dice una publicación de 7 años en SO (no está mal, solo está desactualizada), sino dónde se necesita cada código y asegúrese de que el usuario pueda utilizar los aspectos más importantes de una página antes de intentarlo para cargar 6 marcos JS para implementar pergaminos paralelos inteligentes y un enlace de datos extensivo para su página de contacto.

BTW Google le pide que presione JS hasta el final porque proporcionan el código de análisis de Google y esto debe ser lo último que se carga.

¡Piensa antes de codificar!