Modelo de programación que representa la estructura de una página web como un árbol de nodos.
Permite a los lenguajes de programación manipular dinámicamente el contenido y estilo de una página web.
// Seleccionar elementos const elemento = document.getElementById('mi-id'); const elementos = document.querySelectorAll('.mi-clase'); const primer = document.querySelector('div.contenedor'); // Modificar contenido elemento.textContent = 'Nuevo texto'; elemento.innerHTML = '<strong>HTML</strong>'; // Modificar estilos elemento.style.color = 'blue'; elemento.classList.add('activo'); elemento.classList.toggle('visible'); // Crear elementos const nuevoDiv = document.createElement('div'); nuevoDiv.textContent = 'Hola'; document.body.appendChild(nuevoDiv); // Eventos elemento.addEventListener('click', (e) => { console.log('Click en:', e.target); }); // React abstrae el DOM con Virtual DOM function Componente() { return <div className="contenedor">Hola</div>; }
