Introduction DOM

DOM stands for Document Object Model. It is a programming interface that allows us to create, change, or remove elements from the document.

In our case, the document is our webpage.

You can think about it this way.

Imagine you're sitting at the TV, and you want to change what's playing. To do that, you will need to take a remote, and switch the channel.

Now, on the web, if you want to make any dynamic changes to the content, you will need to do this through the DOM with Javascript.

The DOM views an HTML document as a tree of nodes. A node represents an HTML element.

Buttons, images and headings are all nodes in the HTML structure.

With JavaScript, we can access and manipulate the DOM. In other words, we can make a boring static document dynamic, fun and interactive.