más JavaScript...

¡Buenas tardes diseñoadictos¡

Ya que en la última entrada estuvimos hablando sobre JavaScript y realizamos el ejemplo de los botones en una página web, con ayuda de este lenguaje de programación. Hoy vamos a continuar con el mismo tema, pero profundizando aún más.

En el ejemplo anterior; empleábamos dos archivos CSS uno para cada estilo y un archivo HTML en el que incluíamos el script y todas las funciones a realizar. Sin embargo, hoy vamos a realizar un ejemplo bastante parecido al anterior, pero utilizando otro procedimiento.

(El objetivo será sacar todas las funciones del HTML y crear un archivo js (JavaScript) en el que implementaremos todas las funciones, que serán llamadas desde el HTML)

Para ello, debemos seguir los siguientes pasos:

1.   En el bloc de nota, crear un archivo con extensión js. En este caso le llamaremos javascript.js. Como en todos los archivos que hemos creado anteriormente:

a.   Tipo de archivo: TODOS LOS ARCHIVOS

b.   Tipo de configuración: UTF-8

En él copiamos las siguientes funciones (texto de la imagen).

2.   Guardamos el archivo javascript.js en la misma carpeta en la que tenemos los CSS y el HTML.

3.   Posteriormente, debemos llamar a estas funciones desde el HTML. Para ello, copiamos el texto del recuadro, justamente igual que en la imagen.

4.   El último paso es comprobar que funciona. Para comprobarlo doble click izquierdo en el archivo HTML.

Para que podáis apreciar los resultados mejor, pinchad en la pestañita que se encuentra arriba a la izquierda en “Mi Sitio Web”. Ahí se encuentra todos los cambios que hemos realizado durante las últimas entradas.

No lo he dicho en las entradas anteriores, pero si tenéis alguna duda solo tenéis que comentarlo y la resolveremos. Espero que estos ejemplos os hayan ayudado a comprender mejor, que es HTML, CSS, JavaScript,…

En nada nos vemos, ¡disfrutad del fin de semana¡