Introduction to the DOM

DOM stands for The Document Object Model. DOM is a platform and language-neutral interface that allows programs and scripts to dynamically access and update the content, structure, and style of a document.

HTML is a markup language used to display content in a browser. When we change the appearance of a webpage, what we are really changing is the Document Object Model, which directly determines the appearance displayed in the browser. We can view and manipulate the Document Object Model by opening our developer tools, but when we do so the HTML is not changed. We can also view our Document Object Model by opening the console and typing in the word document. We can use JavaScript and the console to update a property of the document object such as document.body and manipulate it. With the HTML DOM, JavaScript can access and change all the elements of an HTML document.