JavaScript JavaScript and the DOM Responding to User Interaction Listening for Events with addEventListener()

Nicholas Wallen
Nicholas Wallen
12,278 Points

What exactly is the point of learning the DOM?

I get what it does. But what is the point of it?

I get it allows us to manipulate things on a page right in front of us, but is it more just for development purposes? Because it's obviously not a finished webpage that is open to the public.

Guess I just don't understand the point of making massive changes to a page that simply reverts when you click the refresh button.

2 Answers

Jennifer Nordell
STAFF
Jennifer Nordell
Treehouse Staff

Hi there! I know that right now it might seem like you're making massive changes that are easily reset whenever you refresh, and that might be true for these examples. But imagine a site like Asana or Trello where users can make "to do" lists, add projects, contacts and more. It would be impossible to know in advance what that HTML would look like. You have no way to know how many projects or items users will add. It will also be different for user A than it will be for user B. User A might have 3 projects and 25 "to-do" items where user B has 1 project and 35 "to-do". At that point, you will be getting information from a database on the server and using it to fill out those elements of the DOM that reflect this. The examples you are learning here are temporary, but that will not always be the case.

The idea here is that you need your website/app to be flexible and change on the fly. This is how we accomplish that.

Hope this helps! :sparkles:

Tyler Durden
Tyler Durden
2,405 Points

I'll give you the best advice on why you need to know the DOM model, in less than a paragraph :

Go build a website right now, a portfolio website, and try to make it interactive. Add some EVENT LISTENERS and such to listen to mouse hovers on images, clicks on div boxes, mouse leaves, key presses and ALL THAT GOOD STUFF.

Now when you try to make your site interactive with JavaScript, you will realize why you need to know the DOM model. It's slightly impossible otherwise (unless you plan to make a completely static webpage with just text and images like wikipedia).