首页 > 代码库 > Web开发标配--开发人员工具-JS调试
Web开发标配--开发人员工具-JS调试
喜欢从业的专注,七分学习的态度。
JS:全称JavaScript,Web中,js主要在两个地方:
- html的<script type="text/javascript"></script> 中.
- js脚本文件中,页面引用js:<script src="http://www.mamicode.com/js/***.js"></script>
JS调试一般在浏览器开发人员工具“调试程序”Tab页。
F12打开浏览器 开发人员工具。
开发人员工具
主要关注点在左侧代码框和右侧监控区域。
关键点: 断点、监控、调试工具。
调试程序简单总结就是断点+监控+调试工具。
断点
调试程序首先在运行前先添加断点,让程序在断点处停止,然后才有监控和调试。
添加断点:行号左侧单击,添加断点后出现断点标志,程序运行到断点处会停止 。
断点
监控
当程序停止在程序调试界面后可以添加需要监控的对象,可以监控的的内容包括对象和公式。
添加监控:选择对象或公式,右键,添加监控。
-
对象监控
选择对象---右键---添加监控,右侧得到对象的值。
对象监控 -
公式监控
选择公式--右键---添加监控,右侧得到对象的值。
公式监控
调试工具
当程序在断点处停顿后可以使用调试工具,一步步观察程序走向。
调试工具
使用“单步调试”工具一行一行执行,观察程序运行步骤,在遇到调用方法时使用“进入调试”进入调用的方法内部观察运行步骤,在调用层次很深时,使用“跳出”回到方法外层,使用“运行”走完调试。
代码搜索
在调试界面有一个输入框,用于检索当前代码内容,进行内容定位,可回车直接定位。
代码检索
开发工具对于每个人都有一些自己的使用习惯,最适合的、最习惯的、自己摸索的、是最好的。
一步一步,坚持积累,坚持学习。
Web开发标配--开发人员工具-JS调试
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。