JavaScript (Sesión 7 de marzo)

Continuando con los lenguajes de programación web, nos adentramos en Javascript, originalmente llamado como LiveScript. Este lenguaje permite mejoras en la interfaz de usuario y páginas web dinámicas.

En nuestra práctica vamos a crear botones a los que se les asignará alguna función.

Enlazando con los contenidos aprendidos en la practica anterior, crearemos un botón con el cual cambiaremos el estilo de la página. Este botón simplemente cambiará la hoja de estilos CSS  de la que se toman los estilos. También se creará otro para volver al estilo inicial.

He aquí el nuevo código introducido:

 - Un nuevo archivo CSS con nuevos estilos, de nombre "final3.css".

 - En el archivo HTML el siguiente código:

• En head, introduciremos el script que define la función que se utilizará:

<script type="text/javascript" language="JavaScript">

function cambio(archivo){

document.getElementById("estilo").href= archivo;

}

</script>

• Aplicar un identificador al estilo inicial:

<link href="final.css" rel="stylesheet" type="text/css" id="estilo">

• En body, en el lugar donde queramos los botones, el siguiente código:

<button type="button" onclick="cambio('final3.css')">Cambiar de estilo</button>

<button type="button" onclick="cambio('final.css')">Volver a estilo inicial</button>

En nuestro caso los hemos situado abajo a la derecha.

¡¡¡Esto es todo por el momento!!!