JavaScript puede ser colocado en el <body> y <head> secciones de una página HTML.
La <script> Tag
En HTML, el código JavaScript debe ser insertado entre <script> y </script> etiquetas.
Ejemplo
<script>
document.getElementById("demo").innerHTML = "My First JavaScript";
</script>
Ejemplos más antiguos pueden utilizar un atributo de tipo: <script type="text/javascript"> .
No se requiere este tipo de atributo. JavaScript es el lenguaje de scripts por defecto en HTML.
Funciones de JavaScript y Eventos
Un JavaScript function es un bloque de código JavaScript, que se puede ejecutar cuando "pedido" para.
Por ejemplo, una función puede ejecutarse cuando se produce unevento, como cuando el usuario hace clic en un botón.
Va a aprender mucho más acerca de las funciones y eventos en capítulos posteriores.
JavaScript en <head> o <body>
Usted puede colocar cualquier número de secuencias de comandos en un documento HTML.
Los scripts pueden ser colocados en el <body> , o en el <head> sección de una página HTML, o en ambos.
Mantener todo el código en un solo lugar, es siempre una buena costumbre.
JavaScript en <head>
En este ejemplo, una función de JavaScript se coloca en el <head> sección de una página HTML.
La función se invoca (llama) cuando se hace clic en un botón:
Ejemplo
<!DOCTYPE html>
<html><head>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</head>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
</body>
</html>
Inténtalo tú mismo " JavaScript en <body>
En este ejemplo, una función de JavaScript se coloca en el <body> sección de una página HTML.
La función se invoca (llama) cuando se hace clic en un botón:
Ejemplo
<!DOCTYPE html>
<html>
<body>
<h1>My Web Page</h1>
<p id="demo">A Paragraph</p>
<button type="button" onclick="myFunction()">Try
it</button>
<script>
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
</script>
</body>
</html>
Inténtalo tú mismo " Es una buena idea colocar los guiones en la parte inferior de la <body> elemento.
Esto puede mejorar la carga de la página, porque su recopilación script puede disminuir el rendimiento.
JavaScript externa
Los scripts también pueden ser colocados en archivos externos:
MyScript.js
function myFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
scripts externos son prácticos cuando se utiliza el mismo código en diferentes páginas web.
Archivos JavaScript tienen la extensión .js .
Para utilizar un script externo, poner el nombre del archivo de script en el atributo src (fuente) de un <script> etiqueta:
Ejemplo
<!DOCTYPE html>
<html>
<body>
<script src="myScript.js"></script>
</body>
</html> Inténtalo tú mismo " Puede colocar una referencia de script externo en el <head> o <body> como desee.
El guión se comportará como si se encuentra exactamente donde el <script> se encuentra la etiqueta.
Scripts externos no pueden contener <script> etiquetas.
Ventajas de JavaScript externo
La colocación de archivos JavaScript en archivos externos tiene algunas ventajas:
- Se separa el código HTML y
- Hace HTML y JavaScript más fácil de leer y mantener
- archivos JavaScript en caché pueden acelerar la carga de la página