HTML vs DOM? Let’s debug them #DevToolsTips

What is HTML? What is the DOM tree? Let's demystify them and learn how to debug them with DevTools.

Chapters:
0:00 Intro
0:15 What is HTML
0:25 What is DOM
0:43 HTML vs DOM
1:11 Manipulate the DOM with JavaScript
1:33 Inspect the DOM
2:09 Locate DOM node quicker
2:27 Use $0 to console log a DOM node
3:03 Edit the DOM
4:09 Drag and drop the DOm node
4:15 Take a node screenshot
4:22 Persist changes with workspace

Resources:
goo.gle/devtools-dom
goo.gle/devtools-workspace
goo.gle/devtools-console-utils
goo.gle/devtools-open

Questions? Tweet to us:
Jecelyn Yeen → goo.gle/jecfish
Chrome DevTools → goo.gle/chromedevtools

Catch more DevTools Tips → goo.gle/DevToolsTips
Subscribe to Chrome for Developers → goo.gle/ChromeDevs

#DevToolsTips