Fundamentos de jQuery

3.8. Ejercicios

3.8.1. Selecciones

Abra el archivo /ejercicios/index.html en el navegador. Realice el ejercicio utilizando el archivo /ejercicios/js/sandbox.js o trabaje directamente con Firebug para cumplir los siguientes puntos:

  1. Seleccionar todos los elementos div que poseen la clase module.
  2. Especificar tres selecciones que puedan seleccionar el tercer ítem de la lista desordenada #myList. ¿Cuál es el mejor para utilizar? ¿Por qué?
  3. Seleccionar el elemento label del elemento input utilizando un selector de atributo.
  4. Averiguar cuantos elementos en la página están ocultos (ayuda: .length)
  5. Averiguar cuantas imágenes en la página poseen el atributo alt.
  6. Seleccionar todas las filas impares del cuerpo de la tabla.

3.8.2. Recorrer el DOM

Abra el archivo /ejercicios/index.html en el navegador. Realice el ejercicio utilizando el archivo /ejercicios/js/sandbox.js o trabaje directamente con Firebug para cumplir los siguientes puntos:

  1. Seleccionar todas las imágenes en la página; registrar en la consola el atributo alt de cada imagen.
  2. Seleccionar el elemento input, luego dirigirse hacia el formulario y añadirle una clase al mismo.
  3. Seleccionar el ítem que posee la clase current dentro de la lista #myList y eliminar dicha clase en el elemento; luego añadir la clase current al siguiente ítem de la lista.
  4. Seleccionar el elemento select dentro de #specials; luego dirigirse hacia el botón submit.
  5. Seleccionar el primer ítem de la lista en el elemento #slideshow; añadirle la clase current al mismo y luego añadir la clase disabled a los elementos hermanos.

3.8.3. Manipulación

Abra el archivo /ejercicios/index.html en el navegador. Realice el ejercicio utilizando el archivo /ejercicios/js/sandbox.js o trabaje directamente con Firebug para cumplir los siguientes puntos:

  1. Añadir 5 nuevos ítems al final de la lista desordenada #myList. Ayuda: for (var i = 0; i<5; i++) { ... }
  2. Remover los ítems impares de la lista.
  3. Añadir otro elemento h2 y otro párrafo al último div.module.
  4. Añadir otra opción al elemento select; darle a la opción añadida el valor Wednesday.
  5. Añadir un nuevo div.module a la página después del último; luego añadir una copia de una de las imágenes existentes dentro del nuevo div.