如何在chrome里给JavaScript代码添加断点调试

2026-02-05 12:58:01

1、首先我们使用chrome浏览器打开我们需要调试的页面并按“F12”键打开“开发者工具”,如下图:

如何在chrome里给JavaScript代码添加断点调试

2、然后选择“开发者工具”中的“Sources”选项,如下图:

如何在chrome里给JavaScript代码添加断点调试

3、然后点击左面的选项打开需要调试的JavaScript代码文件如下图:

如何在chrome里给JavaScript代码添加断点调试

4、此时在右面就出现了我们需要调试的JavaScript代码如下图:

如何在chrome里给JavaScript代码添加断点调试

5、然后我们就可以在代码左侧的“行数”上点击鼠标左键添加断点或者再次点击取消断点,如下图

如何在chrome里给JavaScript代码添加断点调试

6、此时我们便可以使JavaScript代码分步执行,使我们能清楚的看清每一行代码的作用和整段代码的执行流程,点击“paused in debugger”按钮执行下一步,从中也可以看到每行代码的赋值情况等,如下图:

如何在chrome里给JavaScript代码添加断点调试

如何在chrome里给JavaScript代码添加断点调试

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢