The DOM in 4 minutes

what is the dom when you try to understand the dom you get complicated explanations and diagrams that's not what this video is here's a simple explanation explaining what the dom is we'll cover why the dom exists what it is in simple terms and how you use it okay in web dev we have three things

html css and javascript they're three different languages but they need to work together to make things happen your html will just look like a word document without css and without javascript well you might as well print it out with your printer anyway what exactly does javascript do well a few different things it can change or add new html for

example when you click the load more button more html needs to be created with those new results javascript can change our page without having to refresh it which is huge the other important thing you can do is respond to user events for example when you click on a button you can make different things happen

around your page this can also be something like submitting a form or sending a message that's all handled with javascript so here's where i'm going with this over here you have all your html it might look something like this now the way we change the html with javascript is with the dom which is over here now

the dom is just the exact same html okay the exact same but it's represented as a javascript object so the dom is always exactly identical to the html on our page if we change anything in the dom our html automatically gets updated and if we add new html then our dom will change too

now things staying in sync we don't have to worry about that the browser takes care of this under the hood but the important part is the dom and html are like the same document in two different languages like english and russian so we can talk about the dom and we don't just mean this object here