chrome调试技巧--持续更新
1、开始调试:右键审查元素
2、按钮功能:
-
调出控制台;
切换开发环境全屏还是嵌入;
清空当前显示;
将压缩 js 文件格式化缩进规整的文件;
3、常用页面功能:
-
- 查看、编辑(双击)HTML;
- 查看选中代码的代码嵌套路径;
- 查看、编辑当前选中代码所用的CSS代码;
- 查看选中元素的盒模型;
- 监听事件;
- 查看属性,比手册还方便;
-
- 查看、编辑当前站点的CSS、JS源文件;
- 加断点调试js代码:单步、跳出跳入循环、查看变量的值;
-
- 控制台输出打印案例:
-
- 查看站点在作出一个动作时都加在了哪些文件;
- 查看文件有木有正确加载、加载方式、状态、类型、大小、所用时间;
- 点击查看该文件的具体情况;
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步