JavaScript DOM
4.9/5 (5906 ratings)
• 
Closed Captions (English)
by Todd Motto
Uncover the depths of the DOM and truly understand your daily JavaScript development.
See Curriculum
The Missing JavaScript DOM Introduction • 10:07
Introduction
3 lessons
-
The Missing JavaScript DOM Introduction 10:07
- Setup Instructions
Readme
- Project Walkthrough and Install
04:38
The Missing JavaScript DOM Introduction 
Setup Instructions DOM Events and JavaScript Loading
2 lessons
- Understanding DOM Loading Events
09:55
- Understanding JavaScript Loading
05:22
DOM Nodes In-Depth
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
Querying and Traversing the DOM
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
Attributes, Styles and Classes
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
Events and Event Listeners
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
Forms and Events
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
Project Build
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
Get the complete bundle...
Everything you need to start mastering JavaScript today
Job-ready training
Job-ready training Nail that interview with your new skills that will set you apart.
All the best practices
All the best practices Best practices, design patterns, performance and architecture.
Stream or download
Stream or download Learn at home at your own pace, download for offline viewing.
Expert knowledge
Built by Google Developer Experts, there's no better place to learn web.
StackBlitz examples
StackBlitz examples Access full course source code and experiment in the browser too!
Slack community
Slack community Exclusive access to our members-only community (6000+ members).
JavaScript Kickstart Bundle
2 courses
Limited time offer ⚡
JavaScript Master Bundle
5 courses
Secure SSL encrypted payments
30-day money back guarantee
These courses are empowering thousands with expert knowledge - they will you too. If you're disappointed for whatever reason, you'll get a full refund.
Location + Student discounts
Not-so-good exchange rate (i.e. India/Brazil)? Are you a student? Contact us for a coupon with your location or student details.
🎉 Get 4 more courses for just $90 extra!
Upgrade to the full JavaScript Master bundle and save 💰
Brought to you by Todd Motto, multi-award winner, world-wide conference speaker and workshop leader. 
Google Developer Expert
-
JavaScript Basics
68 lessons -
JavaScript DOM
49 lessons -
JavaScript Masterclass
25 lessons -
JavaScript HTML5 APIs
Almost ready -
JavaScript Testing
Almost ready
