Buena practicas para colocar el codigo JavaScript

[skyz]

Saludos comunidad, tengo la siguiente duda,

Siempre coloque el codigo JavaScript en la etiqueta head, pero alguna vez vi un codigo que lo colocaban antes de cerrar la etiqueta body, cual es el mejor lugar para colocar el codigo javascript, ya sea para que sea: optimo, ordenado.

[zerokilled]

buenas...
en mi opinión, en esos ejemplos que vistes, la organización pudo ser lo menos importante. sin duda la organización ayuda a localizar mejor las cosas pero la idea no es tanto que quede todo exactamente ordenado, sino las ventajas o desventajas que ofrece una forma u otra. el contenido en HEAD carga antes de BODY. esto puede ser útil si requieres que ciertos scripts estén disponibles antes de interpretarse el BODY. pero tiene la desventaja de que no puedes realizar operaciones con el DOM del BODY y su contenido porque aún dicha parte no existe. es por ello que si algún script opera en el BODY debes realizar las operaciones mediante el evento onload o similares. por contraste, si ubicas el script antes del cierre de BODY puedes tener la seguridad que la mayor parte del BODY ha sido interpretado y puedes acceder el DOM sin problema. no es que sea mejor, sino que es otra alternativa. otra razón para ubicar los scripts al final puede ser para no demorar el contenido principal especialmente si el script es muy pesado (en terminos de bytes). aunque en mi opinión este último no es de gran preocupación si consideras que la mayoría de los sistemas son eficaces. sin embargo, un script mal diseñado siempre puede afectar el rendimiento.

[skyz]

Gracias por la respuesta zerokilled, esta entendido, una duda mas, que pasaria si un usuario apreta un boton antes de que se cargue la pagina por completo y el script este antes de cerrar la etiqueta body, no se mostrara la accion de js y el usuario navegaria sin js, puede pasar?

[zerokilled]

¿navegar sin js? demasiado improbable. ¿qué pasaría? todo depende de dos cosas: hasta que punto ha cargado el script y cuál sea el evento defacto de dicho botón (sin aplicarse js). por ejemplo, un INPUT BUTTON no hace nada por si solo, pero un elemento <a> con intenciones de ser usado como botón llevaría al usuario a la url de destino si tuviera alguna.

[skyz]

Gracias zerokilled tema solucionado