Web Development
Beginner
What is DOM (Document Object Model)?
A programming interface for HTML documents that represents the page structure as a tree of objects that can be manipulated with JavaScript.
The DOM represents HTML as a tree of nodes. JavaScript can read, modify, add, and remove elements: document.getElementById("id"), element.innerHTML, document.createElement("div"), parent.appendChild(child). Events (click, submit, keypress) trigger JavaScript functions.
Direct DOM manipulation is slow for complex updates. Modern frameworks (React, Vue) use a Virtual DOM — an in-memory representation that calculates minimal changes before updating the real DOM. Understanding the DOM is fundamental to frontend development.