- 按`F12`或`Ctrl+Shift+I`（Windows）/`Cmd+Option+I`（Mac）直接呼出控制台，无需通过菜单栏层层点击。
- 右键点击页面元素选择“检查”，可精准定位HTML标签并高亮显示对应区域。
2. 实时修改页面样式
- 在“Elements”面板中直接双击CSS属性值（如`color: red;`），输入新值后回车，立即查看效果。
- 按`Ctrl+Shift+P`调出命令菜单，输入“Styles panel”切换到精简模式，仅显示样式编辑区域。
3. 抓包与网络分析
- 进入“Network”标签页后按`F5`刷新页面，点击请求条目可查看头信息、响应数据及加载时间。
- 右键点击某条请求选择“Block request domain”阻止特定资源加载，用于测试页面依赖关系。
4. 断点调试JavaScript
- 在“Sources”标签页找到脚本文件，点击行号设置断点，按`F8`逐步执行代码，观察变量变化。
- 按`Ctrl+P`搜索代码关键词，快速定位函数定义或事件监听位置。
5. 移动端模拟与调试
- 按`Ctrl+Shift+M`（Windows）/`Cmd+Option+M`（Mac）切换至手机视图，支持旋转屏幕、触摸事件测试。
- 在“Console”输入`document.body.style.width = '375px'`手动调整页面宽度，模拟不同设备尺寸。
6. 保存与分享调试结果
- 右键复制选中元素HTML代码（`Copy → Copy element`），直接粘贴到编辑器保存。
- 在控制台输入`copy($0)`将当前元素转为JS代码片段，便于分享或二次开发。
