如何单步调试代码 | Chrome DevTools | Google Developers

通过每次执行一个代码行或一个函数，您可以观察数据和页面中的变化，准确了解正在发生什么。

您还可以修改脚本使用的数据值，您甚至可以修改脚本本身。

为什么此变量值是 20 而不是 30？为什么该代码行看上去没什么效果？为什么此标志在应为 false 的时候成为 true？ 每个开发者都面临这些问题，逐步执行代码可了解问题所在。

设置断点后，返回此页面，并正常地使用它，直到达到某个断点。

这将暂停页面上的所有 JavaScript，焦点转向“DevTools Sources”面板，并突出显示断点。