Introducción a Java Script

Bienvenidos de nuevo a todos, en este post les voy a hablar de como usar el JAVA SCRIPT que hemos trabajo en clase.

Esta vez hemos creado un programa en el que al poner la etiqueta «input» la caja cambia de color y si pasas el ratón por encima de los reyes magos aparecen alertas sobre la carta hacia ellos.

Hasta ahora hemos visto como crear una página web con HTML y como darle estilo con nuevas carpetas como el CSS, la cual es la encargada de organizar la presentación y aspecto de una página web, y otra carpeta como la IMG en esta añadimos las imágenes que vamos a poner en esta página web, con el JavaScript nuestra página web va a tomar “movimiento”, vamos a poder interactuar con el navegador (abrir ventanas, ir adelante o atrás en el histórico…) e interactuar con los elementos de nuestra página web (verificar formularios, añadir/eliminar contenido, …).

¿Cómo usar el Java Script?

1. Primero, ve a tu sitio de pruebas y a la carpeta llamada ‘HTML’ y creamos la carpeta llamada «javascript» (sin las comillas). Luego creamos un archivo dentro de dicha carpeta llamado «Loquequieras.js», a tener en cuenta que podemos poner el nombre que nosotros queramos, siempre y cuando termine js. Y por último guárdalo en tu carpeta scripts.
2. A continuación, abre tu archivo html e introduce el siguiente elemento en una nueva línea, justo antes de la etiqueta de cierre </body>:

A continuación, aplicamos el código Java Script a la página.

TIPOS DE EVENTOS:

Cada evento tiene un nombre, al que también se llama “tipo de evento”. Por ejemplo al evento correspondiente a hacer click se le identifica como “onclick”. Normalmente los nombres se forman anteponiendo el prefijo on con el nombre de lo que ocurre en inglés. Así por ejemplo “onload” indica “cuando termina la carga del documento HTML”.

Cada evento está asociado a un objeto que es quien recibe o detecta el evento, al que se denomina target u objetivo del evento. Así, el evento onclick del ejemplo anterior tiene como objetivo un nodo HTML de imagen, y un nodo HTML div. El evento onload tiene como target el objeto window u objeto global.

Ejemplos de eventos:

Por ejemplo tenemos el manejador de eventos onclick, que sirve para describir acciones que queremos que se ejecuten cuando se hace un click. Si queremos que al hacer click sobre un botón pase alguna cosa, escribimos el manejador onclick en la etiqueta <INPUT type=button> de ese botón.

Cada elemento de la página tiene su propia lista de eventos soportados, vamos a ver otro ejemplo de manejo de eventos, esta vez sobre un menú desplegable, en el que definimos un comportamiento cuando cambiamos el valor seleccionado.

¿Qué es una función?

Toda función en JavaScript es un objeto «Function». Los eventos son la manera que tenemos en Javascript de controlar las acciones de los visitantes y definir un comportamiento de la página cuando se produzcan. Cuando un usuario visita una página web e interactúa con ella se producen los eventos y con Javascript podemos definir qué queremos que ocurra cuando se produzcan.

¿Cómo acceder a un elemento?

Para acceder a un elemento_id necesitamos crear en el html un div con una id, por ejemplo <div id=»algo» oninput=»cambiacolor2()»> y en el js añadirle al function la etiqueta, por ejemplo document.GetElementById(«algo»).