JavaScript DOM 
47 lessons
•7 hours
•
4.9/5 (6329 ratings)
Get an extra 35% OFF everything with coupon code BLACK_FRIDAY
47 lessons
•7 hours
• 4.9/5 (6329 ratings)
JavaScript DOM Uncover the depths of the DOM and truly understand your daily JavaScript development.
Closed Captions in English
Updating State via Event Delegation • 15:21
An excellent dive into JavaScript DOM, yet another stellar course - thoughtfully presented. Five stars all the way.
James Duffy
Full Stack EngineerThis felt like sitting in on a working JavaScript programmer as he was working through various parts of a program. For me, that really worked. Many of the concepts that seemed complex before became understandable.
Bruce Peters
Owner and Developer, Just Loans Inc.Best way to learn DOM interaction for JavaScript! I am a big fan of Todd Motto, I have been following him since his Angular classes are introduced.
Krishna Prasad
Front-End DeveloperI have been waiting for JavaScript DOM for a long time, and understand now why it took long to craft it. It's complete, precise, thanks so much!
Nicolas Devaux
Tech Lead Developer, NaxosWas the perfect JavaScript intro 7 months ago. Now with an dev internship under my belt, I revisited at 2x speed and filled in some gaps.
Chris Archer
Developer Intern, Gemini SocietyAs a complete beginner, this course was perfect for me. I now feel super confident in my JavaScript skills. Thank you very much Todd, for this clear and comprehensive course.
Nguyen Thanh Xuan
Software EngineerI have 30+ years as software programmer, and found JavaScript Basics very well explained and easy to follow alone.
Hishmad Amudi
CTO, PT. Global Kreasi DanaTodd is the master of JavaScript - as we all know! This course is so clear and well presented. I’ve learned so much from these lessons and will refer back to them forever.
Elliott Porter
Full Stack DeveloperThe way JavaScript should be taught from the start. I've watched it 3 times and learn more each time.
Franco Zanki
JavaScript DeveloperEverything you need, structured and ready to go.
3 lessons
The Missing JavaScript DOM Introduction
10:07
Setup Instructions
Readme
Project Walkthrough and Install
04:38
2 lessons
Understanding DOM Loading Events
09:55
Understanding JavaScript Loading
05:22
10 lessons
DOM Nodes Explained
14:35
Creating DOM Nodes
06:45
Changing Content of DOM Elements
09:22
innerHTML versus createElement
11:18
Using DocumentFragments
07:46
Inserting DOM Elements
08:26
Inserting DOM as String Templates
06:11
Replacing DOM Elements
05:19
Cloning DOM Elements
04:56
Removing DOM Elements
04:01
6 lessons
Querying DOM Nodes (HTMLCollections)
11:09
Querying DOM Nodes (NodeLists)
08:10
Looping over DOM Elements
06:34
Finding Child Elements
09:24
Finding Parent Elements
03:51
Finding Sibling Elements
05:06
4 lessons
Element Properties versus HTML Attributes
07:01
Setting and Getting HTML Attributes
05:09
Setting and Getting Inline Styles
07:12
Setting and Getting Classes
09:33
6 lessons
Adding Event Listeners and Event Object
12:30
Removing Event Listeners
07:10
Event Bubbling, Capturing and Propagation
12:31
Preventing Default Event Actions
11:09
Event Delegation and Dynamic Events
13:13
Keyboard Events
10:37
8 lessons
Accessing Forms and Elements
11:00
Form Submit Event and FormData
11:41
Transforming FormData for the Server
16:30
Posting FormData via Fetch API
05:50
Handling Input Elements
10:46
Handling Radio Input Elements
11:53
Handling Checkbox Input Elements
07:53
Handling Select Elements
13:18
10 lessons
Setup Instructions
Readme
Project Setup and Install
04:03
Structuring our HTML Template
04:25
State Initialization and Submit Events
06:48
Rendering State with Template Literals
07:54
Updating State via Event Delegation
15:21
Deleting Items from State
06:57
Toggling UI State and Filtering Collections
07:18
Persisting State to LocalStorage
09:04
Dynamic DOM Injection and Editing
17:55
Everything you need to start mastering JavaScript today
Built by Google Developer Experts, there's no better place to learn.
Design patterns, battle-tested techniques, architecture and performance.
Learn at home at your own pace, download for offline viewing.
Nail that interview or promotion with skills that will set you apart.
Access full source code, and experiment live in the browser.
Exclusive access to our members-only community (7,000+ members).
If you're disappointed for whatever reason, you'll get a full refund (but I'm sure you won't need it).
Not-so-good exchange rate? (i.e. India/Brazil). Student?
Email us for a coupon for your country or student ID.
