Javascript – #5.01. DOM. Acceso y modificación de elementos. Texto y atributos

Lección
Materiales

Damos comienzo a la primera lección del curso en el que veremos cómo podemos acceder a los diferentes elementos de una página web, modificar su texto y atributos, y por qué debemos elegir una opción u otra.

Veremos tres modos de seleccionar elementos:

  • A partir de su identificador, mediante getElementById.
  • A partir de su clase, mediante getElementsByClassName.
  • A partir de su etiqueta, mediante getElementsByTagName.
  • A partir de su selector CSS, mediante querySelector.

¡Pero ojo! No es lo mismo utilizar un método que devuelva un único elemento, como es el primer y último caso, que utilizar cualquiera de los otros dos, que devuelven arrays y, por lo tanto, deben ser procesados como tal.

Además, veremos cómo modificar el texto que contiene un elemento «no vacío», como es el caso de un párrafo, utilizando .innerHTML; cómo añadir un atributo a un elemento, mediante el método .setAttribute; y cómo añadir o quitar clases utilizando .className.

¿Quieres saber cómo? ¡Echa un ojo al vídeo y verás el funcionamiento con ejemplos!

¡Consulta en la pestaña Materiales el código fuente trabajado en la lección!

¿No te ha quedado claro? ¿Quieres aportar tu punto de vista? ¡Deja tu comentario!

¡Ups! ¡Este contenido está restringido a codelovers! Inicia sesión o, si aún no eres miembro de Didacticode, regístrate!