The JavaScript DOM explained in 5 minutes! 🌳

#JavaScript #tutorial #course
// DOM = DOCUMENT OBJECT MODEL
// Object{} that represents the page you see in the web browser
// and provides you with an API to interact with it.
// Web browser constructs the DOM when it loads an HTML document,
// and structures all the elements in a tree-like representation.
// JavaScript can access the DOM to dynamically
// change the content, structure, and style of a web page.

[@BroCodez]

// DOM = DOCUMENT OBJECT MODEL
// Object{} that represents the page you see in the web browser
// and provides you with an API to interact with it.
// Web browser constructs the DOM when it loads an HTML document,
// and structures all the elements in a tree-like representation.
// JavaScript can access the DOM to dynamically
// change the content, structure, and style of a web page.
console.log(document);
console.dir(document);
document.title = "My website";
document.body.style.backgroundColor = "hsl(0, 0%, 15%)";
const username = "";
const welcomeMsg = document.getElementById("welcome-msg");
welcomeMsg.textContent += username === "" ? `Guest` : username;


Document

Welcome

[@bhigh1983]

Your video is good with clear explanations and it's easy for me to understand the code. I love it.

[@masternobody1896]

bro make ai video

[@kenkioqqo]

Bro, this is the first time I've really understood how the DOM works. Thanks for the clear and simple breakdown of such a complex concept.

[@AnalPro_69]

I learnt html and css easily by your videos ❤ now I'm trying to learn js 🙏

[@user-cm7ww8rn7k]

Great explanation. If you made an HTML version and a CSS version of this video, then combine all 3 into a playlist, it'd be a great introduction for anyone looking to code.
I love the way you break down the stuff and have a simplification at the top. You keep things simple so ppl underdstand rather than copy. Bro Thanks.

[@ok_e3w]

crazy good introduction, incredible I watched a 3 hour tutorial and didnt even scratch this, thx again

[@l-fitness3590]

short simple videos are always better because you can just practice and mess around after with the information you learnt

[@thejoker-]

Alot support for you bro❤

[@Ryan-mk6ch]

so clear and explanatory!! thank you for this video!!

[@AmjadGD]

Thank you so so so much

[@uxus-oh3qk]

Best explanation...ever.

[@itsshafayat6378]

that is such a good explanation
bro fr knows the bro code

[@realoogabooga]

please keep doing what you're doing bro🙏🏻

[@dustmukhammad]

This is soo clear explanation broooo! Thank you!!!!

[@AhmedRaza-ty7zq]

Awesome video😎😎👍👍

[@A_curious_chicken]

Nice tutorial

[@Tech-Dev]

Cheers for this tutorial.

[@ikuubi]

All I can say is _Understandable and have a good day_

[@nevouxjulie6595]

Great video !

[@GoalDigger-footboll]

for what purpose u use
: sign use on line .

[@valenciawalker6498]

Thank you

[@kushagrarai7799]

Surprise Surprise mfs the King is back👑

[@gopalgohel4302]

Thank you sir

[@016632]

i want to hit the mute button how do i use DOM to mute desktop audio???

[@LeonardMona-g2d]

0281 Alf Motorway

[@dipereira0123]

CHAD! Chanel 🍷🗿

[@hlahtunthein2830]

msg means Uncle Roger , 😂😂 just kidding

[@tsunningwah3471]

zguba！

[@nihongo_]

W

[@chathuraranasingha4942]

0:07 DOM is not a JS object, but it represent the page we see in the browser

[@danielgilleland5724]

DOM is a JS object _which_ represents the page we see in the browser.

[@tsunningwah3471]

fru

[@sangeethasancharaya6870]

every time i code document.getelementbyId the console says document is not defined. how could i overcome this problem. im using node.js

[@Raymond_G]

document.getElementById()is displayed on the screen bro and not in the console.
For the console ,it is
Console.log() you have to define your element with console to view it in your console.