WTF is the DOM?

A web page is just a file, or a representation of a file. Usually an HTML file. The DOM, or document object model, is the API through which that file's HTML code can be accessed and manipulated.

The DOM is technically separate from JavaScript, but is often seen in use through JavaScript. For example, the following code gives us a list of all links (anchor tags/) on the page:

const allLinks = document.getElementsByTagName("a");

It is through the DOM that the contents of the HTML page can be manipulated. For example, I could take the allLinks object from above and make them all red.

for (let link of allLinks) link.style.color = "red";

Run those two lines in the browser after the page has been loaded and it will turn the links on the page red!

That's a very brief introduction to the DOM, but that's all it is at a very high level — a programmatic representation of the HTML code that is the basis for what you see on screen when viewing a web page.

If you'd like to learn more MDN has an excellent introductory page on the DOM that goes into a lot of detail.