"Se utiliza JavaScript para conseguir páginas Web interactivas..."
Basicamente, existe tres maneras de colocar código javascript en una página Web:
- Referenciar archivos javascript externos
- Embeber código javascript en el propio documento.
- Insertar código javascript en los atributos de evento de los elementos HTML
-
Una vez elaborado el programa o script con un simple editor de texto, lo guardas con extensión .js.
- Ahora debes enlazar tu página Web con ese archivo. Para realizar esta acción, incluye un par de etiquetas
scripten la pagina, preferiblemente en la cabecera del documento. - Luego debes añadir la ruta a tu archivo utilizando el atributo
src=""de dicho elemento.
Ejemplo:
<head>
<script src="ruta/archivo.js"></script>
...
<head>
- NO puede haber contenido JavaScript cuando se utiliza el atributo src.
- Existen otros atributos para el elemento script; es típico utilizar el atributo type="text/javascript", pero no es necesario indicarlo explícitamente cuando concurren las siguientes dos condiciones:
(1) Has utilizado el atributo "src" para referenciar un archivo externo.
(2) Tu script o guión ha sido programado mediante el lenguaje identificado con el tipo MIME "text/javascript". En caso contrario, por ejemplo, si has programado con VBScript, deberás incluir el tipo MIME correspondiente obligatoriamente.
En este caso debe omitirse el atributo "src". Y el atributo "type" tiene por defecto el valor "text/javascript", por lo que puede omitirse siempre y cuando se programe con el lenguaje que se corresponde con dicho tipo MIME. El contenido JavaScript debe incluirse entre las etiquetas de apertura y cierre script
Ejemplo:
<script>
window.alert("Bienvenido a mi página Web");
</script>
- Utilizando el atributo
onloaddel elemento body. Su contenido se executará una vez cargada la página - Definir los atributos
event"onload | onload()"yfor="window"en el elemento script. - Utilizando el atributo
defer="defer"del elemento script.
Toda acción que se realiza una vez cargada la página Web puede tener asociado código JavaScript. Por ejemplo, al pulsar en un enlace de la página se dispara el evento "click" de dicho elemento, y el atributo onclick de dicho elemento puede contener el código que queremos que se execute. Por lo tanto, solo es necesario insertar código dentro de estos atributos para que se execute cuando se disparan tales acontecimientos.
Ejemplo:
<p onmouseover="this.style.color='red';">Este texto se coloreará en rojo cuando el puntero de tu ratón lo cruce<p>
--PRACTICA:
Colorear un texto tras dispararse cierto evento
Aplica la acción siguiente con el texto que encontrarás más abajo para cambiar su color:
Clicar:"MAROON" || Apuntar:"BLACK" || Desapuntar:"YELLOW"
ESTE TEXTO CAMBIA DE FORMA DINÀMICA
Código
<p onclick="this.style.color='maroon'" onmouseover="this.style.color='black'"
onmouseout="this.style.color='yellow'">ESTE TEXTO CAMBIA DE FORMA DINÀMICA</p>
Saludos
No hay comentarios:
Publicar un comentario
Escribe tu comentario...