JavaScript habla con el DOM

El DOM es el árbol de nodos que el navegador construye a partir del HTML. JavaScript lo lee y lo modifica en vivo.

// 1) Encontrar un elemento
const tit = document.querySelector('#titulo');

// 2) Leer / cambiar su contenido
tit.textContent = 'Nuevo título';

// 3) Crear nodos y agregarlos
const li = document.createElement('li');
li.textContent = 'item creado por JS';
document.querySelector('#lista').appendChild(li);
Título inicial — escrito en el HTML
→ Cada botón ejecuta unas líneas de JavaScript que tocan el DOM. Más sobre el DOM: MDN · DOM.