The DOM is how JavaScript sees and changes a web page. Every interactive feature you build, from a menu that opens to a search box that filters results, uses the DOM and events. React and other frameworks are built on top of these same ideas.
What the DOM is
When the browser reads your HTML, it builds a tree of objects called the Document Object Model. Each element becomes a node you can find, read and change with JavaScript.
const title = document.querySelector("h1");
title.textContent = "Today's prices";querySelector uses the same selectors as CSS: "#id", ".class" or "tag". querySelectorAll returns every match.
Changing the page
element.textContent = "..."changes text safely.element.classList.add("open")adds a CSS class, so CSS handles the look.