Ejercicios Unidad 2  Lenguajes de marcas, hojas de estilos y lenguajes de script en clientes 

Unidad 2 –Lenguajes de marcas, hojas de estilos y lenguajes de script en clientes.

Bloque de ejercicios de formularios de

JavaScript
 

E1.‐ Hacer una web usando HTML y Javascript que tenga el aspecto que
aparece aquí abajo y haga exactamente lo que está escrito en la página

Necesitarás conocer estas dos funciones para poder hacer el ejercicio: 

• Math.random() genera un número aleatorio decimal entre 0 (incluido) y 1 (excluido). Es 
decir, el número aleatorio mayor que podemos generar sería 
0,99999999999999999999999...  
• Math.floor(x) trunca el número decimal x a su parte entera. 

E2.‐ Hacer una web usando HTML y Javascript que tenga el aspecto que
aparece aquí abajo y haga exactamente lo que está escrito en la página
(Recuerda que los elementos HTML tienen un atributo llamado hidden que
hace que su contenido permanezca oculto)

 
Página 1

Ejercicios Unidad 2  Lenguajes de marcas, hojas de estilos y lenguajes de script en clientes 

E3.‐ Queremos hacer un pequeño formulario para un buzón de sugerencias

anónimo vía Internet. Visualmente debe de presentar un aspecto similar a
este (aunque el aspecto y la corrección visual no será objeto de evaluación):

Tienes que tener en cuenta: 

1. La caja de comentarios debe de permitir un máximo de 150 caracteres. El número de caracteres 
escrito y los restantes hasta el máximo deben de actualizarse de forma automática mientras 
escribimos en las cajas de texto de debajo.  
2. Cubrir todas las condiciones posibles para actualizar la caja de comentarios es muy difícil 
(podemos borrar caracteres con el ratón y sin usar el teclado, por ejemplo) pero al menos se 
deberá de capturar el evento onKeyUp. Piensa en otras situaciones y que otros eventos podrían 
ayudar en algunas circunstancias y aplícalo también si se te ocurre como.  
3. La propiedad que nos da la cantidad de caracteres escritos en el textarea es value.length.  
4. La propiedad que nos permite modificar el contenido de las cajas de texto que actúan como 
contadores es value. Piensa que estas cajas deberían de ser de “sólo lectura” para que el 
usuario no las modifique manualmente.  
5. El botón de enviar sólo debe de estar habilitado cuando se pulse el checkbox de “Acepto las 
condiciones”. La propiedad que nos permite controlar si está marcado es checked  
6. Piensa que al pulsar el botón de Limpiar formulario deberíamos de verificar que este queda tal y 
como en el estado inicial. 

   

 
Página 2

Ejercicios Unidad 2  Lenguajes de marcas, hojas de estilos y lenguajes de script en clientes 

E4.‐ Deseamos hacer una página web que presente dos paneles de
contenido. Mientras que el ancho de la superficie del navegador sea superior
a los 500 px, estos paneles se mostraran uno al lado del otro, pero si
desciende por debajo de ese valor, deberán de presentarse uno
encima del otro. En uno de los paneles habrá un pequeño formulario con un
botón. Cuando se pulse el botón la información escrita en dicho formulario
debería de aparecer en el panel de la derecha tras una pequeña validación
que nos indique de alguna forma si los campos de nombre y/o apellido están
vacíos. Los campos del formulario deben de ser, al menos, los que se
muestran en la figura: Nombre, Apellidos, Edad y Sexo.

 
Página 3