El DOM: selección y manipulación de elementos
Cómo JavaScript accede y modifica el HTML de la página.
El DOM representa la página como un árbol de nodos que JavaScript puede leer y modificar. El método más usado para seleccionar elementos es document.querySelector('selector') (devuelve el primer elemento que coincide) y document.querySelectorAll() (devuelve todos como una lista).
Una vez seleccionado un elemento, se puede cambiar su contenido con elemento.textContent o elemento.innerHTML, su estilo con elemento.style.propiedad, o sus clases con elemento.classList.add() / .remove() / .toggle().
También se pueden crear elementos nuevos con document.createElement() e insertarlos con elemento.appendChild(), construyendo interfaces dinámicamente.
Ejemplo — pruébalo tú mismo
Ponlo a prueba: Selecciona un párrafo por su clase y cambia su texto usando textContent.