DOM

The DOM (Document Object Model) is the browser's internal model of a web page: every heading, paragraph, image, and container becomes a node in a tree the browser builds from the page's HTML.

Scripts and styles work by reading and changing that tree. When JavaScript inserts a menu item or CSS hides a panel, both are talking to the DOM - not to the original HTML file on disk. A large or deeply nested DOM means more work for every update, which is why DOM size shows up in performance findings.

From the DOM, the browser also builds the accessibility tree: a simplified view that assistive technology uses. If an element is missing or misnamed there, a screen reader cannot present it correctly, no matter how the page looks.

Learn more

• DOM Standard - the WHATWG specification
• Introduction to the DOM (MDN) - approachable overview
• Accessibility tree