• 第1章 课程介绍
• 视频：1-1 课程介绍(03:06)
• 视频：1-2 Chrome DevTools 功能简介(02:07)
• 视频：1-3 打开开发者工具(03:27)

• 第2章 使用 Elements 调试 DOM
• 视频：2-1 查看与选择 DOM 节点(04:37)
• 视频：2-2 实时编辑 HTML 和 DOM(04:52)
• 视频：2-3 在 Console 中访问节点(04:16)
• 视频：2-4 在 DOM 中断点调试(06:06)

• 第3章 调试样式及 CSS
• 视频：3-1 查看与编辑 CSS(06:16)
• 视频：3-2 在元素中动态增加类与伪类(03:36)
• 视频：3-3 快速调试 CSS 数值及颜色图形动画等(05:08)

• 第4章 使用 Console 和 Sources 调试...
• 视频：4-1 Console 面板简介与交互式命令(05:24)
• 视频：4-2 在 Console 中调试 Log 日志(17:15)
• 视频：4-3 调试 JavaScript...(16:39)
• 视频：4-4 Sources 面板简介(06:26)
• 视频：4-5 使用 Snippets 来辅助...(05:09)
• 视频：4-6 使用 DevTools 作为代码编辑器(05:33)

• 第5章 调试网络
• 视频：5-1 Network 面板简介(04:01)
• 视频：5-2 使用 Network 详细分析请求(12:34)
• 视频：5-3 使用 Network Waterfall...(05:17)

• 第6章 客户端存储 Application 面板
• 视频：6-1 查看与调试 Cookie(05:49)
• 视频：6-2 查看与调试 LocalStorage 与...(04:16)

• 第7章 调试移动端、H5 页面及远程调试
• 视频：7-1 模拟移动设备(03:15)
• 视频：7-2 使用 Chrome DevTools 进行...(06:41)

• 第8章 在 DevTools 中集成 React 和 Vue 插件
• 视频：8-1 集成 React 插件(05:04)
• 视频：8-2 集成 Vue 插件(02:49)

• 第9章 总结
• 视频：9-1 课程总结(05:01)