@nabeeljaved1742
i got job because of you. i have watched jquery, javascript and dom, react , ,vue. you have professional content huge respect man !
@chevalier5691
Kind of insane to think that Brad single-handedly pumped thousands of future developers and engineers into the world. And it all start with small series like this. Couldn't thank you enough, Brad.
@arshadgamer8621
DOM is most important topic for web development, but it is often missed by many youtubers... You created 4 videos on DOM, Thanks a lot...
@eS_Zett
02:45 DOM Introduction 04:52 HTML Structure 07:07 Examine the Document Object (console.dir() & console.log()) 15:43 Selectors 15:54 getElementById() 22:29 getElementsByClassName() 27:11 getElementsByTagName() 29:14 querySelector() 34:48 querySelectorAll()
@millertime6
Dude, this was the best explanation I've seen of this concept. Most of the tutorials I've seen run through the material so fast they forget to lay out the logic, then they give you a project to do before you even learn it! It sucks because I then have to go somewhere else to fill in the gaps.
@teiki7756
Even in August 2021 this is the best DOM Tutorial on the internet. Thank you Brad for all the great explanations and humble attitude.
@dogstar2020
I've never seen a review of the DOM in plain JS like this before! This is GREAT.
@berting347
It's 2024 and still very helpful
@maximocaceres4685
Here from TOD. Found this first episode very informative. Looking forward for the next episodes! Thank you.
@josuegarduno7154
Took me around ninety minutes to get through the entire video because I was taking notes and coding along. You have such a great way to explain concepts that I couldn't understand yet.
@inception252
i like man teacher seems pretty legit source and completely not time wasting
@justsurfrax
Yet another amazing video , so useful, 90% of what I know on how to code from you, before I even knew it was you I bought several eudonix courses and than I arrived to your youtube channel (or I believed I was in both at the same time but never paid attention that it was exact the same voice) , you are a great teacher and post every day.. I opened many apps in the last months and this would have never happened if it wasn't because of your teachings.
@Chicgeek88
This was right on time! I started learning about the DOM today!!!
@10Zenil
i have been trying to learn about DOM the whole day by finding resources on the internet, but cant understand it fully. This video is a gem for real, cleared all my doubts i had about DOM
@eoluwaloseun
I can't lie, many things seems strange untill I watch and practicalised this tutorial. this video is everything I need right now....Thank you for this master piece..👏
@sumantsagar9162
coming from odin Project keep grinding guys
@zachfotis
The most comprehensive tutorial on DOM manipulation out there. Thank you !
@mushrafaltaf
Holy shit this guy is a real master. I learnt so fucking much in this 100 mins and there are 46 more videos in this playlist alone! Who needs university? There are MIT and Harvard CS lectures online for free if you require advanced CS and math topics.
@samialvi4226
There's always something new to learn from Brad. You have my undying gratitude and respect~!
@frogsama666
For anyone who needs to the HTML and CSS file. I'm not using bootstrap. <!-- HTML --> <header id="main-header" class="bg-success"> <div class="container"> <h1 id="header-title">Item Lister</h1> </div> <!-- container--> </header> <div class="container"> <div id="main" class="card card-body"> <h2 class="title">Add Items</h2> <form> <input type="text"> <input type="submit" class="btn" value="Submit"> </form> <h2 class="title">Items</h2> <ul id="items" class="list-group"> <li class="list-group-item">item 1</li> <li class="list-group-item">item 2</li> <li class="list-group-item">item 3</li> <li class="list-group-item">item 4</li> </ul> </div> <!-- main -- card -- card-body --> </div> <!-- container --> /*--- CSS ---*/ /*-------- GENERAL --------*/ * { margin: 0; padding: 0; box-sizing: border-box; } body { font-family: sans-serif; } .container { padding: 0px 25px; } /*-------- HEADER --------*/ #main-header { background-color: rgb(0, 126, 0); height: 70px; display: flex; align-items: center; padding: 20px; } #header-title { color: white; font-size: 40px; } /*-------- MAIN CONTENT --------*/ #main { border: 1px solid rgb(180, 180, 180); padding: 20px; margin-top: 20px; } .title { margin: 20px 0px; font-size: 30px; } .title:first-child { margin-top: 0px; } input { height: 30px; border: 1px solid rgb(180, 180, 180); } .btn { background-color: rgb(39, 39, 39); color: white; width: 100px; border: 0px; cursor: pointer; } .list-group-item { border-bottom: 1px solid rgb(180, 180, 180); list-style-type: none; margin-bottom: 20px; } .list-group-item:last-child { margin-bottom: 10px; }