Knowledge Maxxing← Back to topic library
Dev MaxxingBeginnerJavaScript75 sec
Document Object Model
The Document Object Model is the browser's in-memory tree representation of a page's HTML, which JavaScript can read and modify to change what's displayed.
Prerequisite: Web browser
What matters
Because the DOM is what the browser actually renders, JavaScript changes to it are what make a page interactive after the initial HTML has loaded.
Example
Calling 'document.getElementById("title").textContent = "Updated"' finds an element in the DOM tree and changes its visible text.
Common misconception
The DOM is not the same as the original HTML source file; it is a live, in-memory structure that JavaScript can change independently of that file.
Recall question
What does changing the DOM with JavaScript actually affect?
Keywords and related concepts
DOMdocument object modelpage structureweb browser