Herramientas de usuario

Herramientas del sitio


informatica:programacion:javascript:incluir_javascript

Diferencias

Muestra las diferencias entre dos versiones de la página.

Enlace a la vista de comparación

Ambos lados, revisión anteriorRevisión previa
Próxima revisión
Revisión previa
informatica:programacion:javascript:incluir_javascript [2024/02/06 10:58] – [JavaScript externo] tempwininformatica:programacion:javascript:incluir_javascript [2024/02/06 11:06] (actual) – [JavaScript externo] tempwin
Línea 3: Línea 3:
 Forma parte de las notas sobre [[informatica:programacion:javascript|JavaScript]]. Forma parte de las notas sobre [[informatica:programacion:javascript|JavaScript]].
  
-JavaScript se aplica a una página HTML de manera similar a CSS, utilizando la etiqueta ''<script>''. El código JavaScript se puede incluir directamente en el código HTML o desde un fichero externo.+JavaScript se aplica a una página HTML de manera similar a CSS, utilizando la etiqueta HTML. En el caso de CSS es con ''<link>'' y para JavaScript se utiliza ''<script>'' 
 + 
 +El código JavaScript se puede incluir directamente en el código HTML o desde un fichero externo.
  
 ===== JavaScript interno ===== ===== JavaScript interno =====
Línea 51: Línea 53:
 </code> </code>
  
-Usamos el atributo ''defer'' para indicarle al navegador que siga descargando el contenido HTML antes de ejecutar el script y así evitamos problemas de que no se puede aplicar algún código JavaScript sobre el HTML porque no esté completamente descargado.+Usamos el atributo ''defer'' para indicarle al navegador que siga descargando el contenido HTML antes de ejecutar el script y así evitar bloqueos en la carga de la página.
  
 <WRAP center round info 60%> <WRAP center round info 60%>
 Antes de existir ''defer'' lo que se solía hacer era colocar el elemento ''script'' justo en la parte inferior del cuerpo (por ejemplo, justo antes de la etiqueta ''</body>''), para que se cargara después de haber procesado todo el HTML. </WRAP> Antes de existir ''defer'' lo que se solía hacer era colocar el elemento ''script'' justo en la parte inferior del cuerpo (por ejemplo, justo antes de la etiqueta ''</body>''), para que se cargara después de haber procesado todo el HTML. </WRAP>
  
 +Existe otro atributo que se puee usar para evitar el problema del bloqueo de ''script'': ''async''. La diferencia con ''defer'' es que ''async'' hace que los scripts se ejecuten inmediatamente tras la carga de la página. El problema es que no hay garantía del orden en que se ejecutarán los scripts.
 +
 +En resumen:
 +
 +  * Si tus scripts se deben ejecutar inmediatamente y no tienen ninguna dependencia, utiliza ''async''.
 +  * Si tus scripts necesitan esperar a ser procesados y dependen de otros scripts y/o del DOM en su lugar, cárgalos usando ''defer'' y coloca tus elementos ''<script>'' correspondientes en el orden que desees que el navegador los ejecute.
 +
 +Las ventajas de tener el código JavaScript en ficheros externos:
 +
 +  * Separa el HTML del código
 +  * Hace el HTML y el JavaScript más fácil de leer y mantener.
 +  * Los ficheros de JavaScript en caché aceleran la carga de las páginas web.
informatica/programacion/javascript/incluir_javascript.1707213488.txt.gz · Última modificación: por tempwin