DOM Why?

I don’t understand why the need to use the DOM when you can just go to your CSS and change the color (for example). Why apply JS to do that when it’s so much easier to just open up your editor and change the color in CSS?

Thanks to all that will take the time to clarify,

Well, javascript can do a lot more then just change color. That is just the start

javascript can handle click events (when button is clicked), load async data (fetch the data from a server and then insert it (DOM manipulation) into the webpage without the page having to reload

Javascript can listen for keyboard events.

Or maybe you want the user of your website that they can change the color (you prompt the for the color, and then manipulate the color according)

Maybe that is what I should explain: the css you define is when the page is rendered, while Javascript can manipulate the page/DOM after its loaded

hope this helps


Thanks a lot. …but. If you want to add interactive functionality to the end user (ex. options to chose background colours on click events etc) you can go at the end of to HTML add ? if so, why DOM?
I really appreciate your help.

The html and css you write is only the initial state of the page

To manipulate the page after being rendered, you need to use JavaScript to manipulate the DOM

DOM is used to modify or bring new interactive functionality to a web page after the deployment, so that the developer won’t need to add said modifications by code editor and re-deployment? Am I getting near?

No, this has nothing to do with deployment

When a user visits your page/website, the html & css is rendered. If we then want to further manipulation on the webpage we need to use Javascript to manipulate the DOM (for example a click event, or a keyboard event)

I though a page rendered or deployed was the same thing: published, available on the internet for the end user.
This clarified.
Thanks a lot!

this means the code is on a server, once you make changes to your website you deploy the changes to the server

then when the user visits your website (their browsers makes a request to your server), the page is being rendered by the browser