如果您使用的是 Chrome 111 或更高版本，可能已经注意到我们更改了断点边栏的设计。在 Chrome 113 中，新的边栏将完全取代旧设计。我们重新设计的目标是改进断点工作流程 ，具体方法如下：
更好地概览 所有已设置的断点。让用户使用断点的常见工作流程更易于访问 且更直观 。 让现有的实用断点功能可见 。
本文假设您已熟悉如何使用断点进行调试。如果您之前未使用过断点，请前往断点概览，详细了解如何使用断点调试代码。
现在，我们来看看重新设计提供了哪些功能，以及如何使用新的边栏！请注意，重新设计侧重于让现有功能更直观易用，而不是添加新功能。
在异常时暂停，以调查代码抛出错误的原因
您的代码是否抛出异常？别担心！Chrome 开发者工具允许您在异常时暂停，以便在抛出异常时停止执行。这有助于您调查并更好地了解代码抛出错误的情况。您可以选择是否要在捕获的异常、未捕获的异常或两者上暂停，只需选中边栏中的相应复选框即可。
管理断点：展开相关断点组，并收起其他断点组，以便专注于相关内容
断点可能分布在多个文件中。断点边栏会根据断点所属的文件对断点进行分组。展开相关断点组，并收起其余断点组，以便专注于当前调试会话中重要的断点。
管理断点：只需点击一下即可跳转到代码、移除或启用/停用断点
借助断点边栏，您只需点击一下即可完成常见任务。下面简要介绍了如何执行以下操作：
在代码编辑器中导航到断点位置。 移除一个断点或文件中的所有断点。 启用或停用一个断点或文件中的所有断点。
只需点击一下即可完成所有这些操作！当然，上下文菜单中也提供了这些选项：
点击断点代码段即可跳转到断点位置
您是否想要检查在代码中设置断点的位置，并分析周围的代码？只需点击边栏中的断点代码段，即可在代码编辑器中打开代码位置。
点击移除按钮即可移除单个断点或文件中的所有断点
将鼠标悬停在断点或断点组上，即可显示移除按钮，点击该按钮即可移除文件中的单个断点或所有断点。
停用文件中的单个断点或所有断点
选中或取消选中断点旁边的复选框，即可启用或停用断点。
如需启用或停用文件中的所有断点，请将鼠标悬停在断点组上，然后选中或取消选中文件名旁边显示的复选框。
利用这些不太为人所知的断点功能：条件断点和日志点
通过修改断点来修改断点条件或更改日志点日志
如需修改断点条件或日志，请将鼠标悬停在断点上，然后点击显示的修改按钮。 系统会打开一个对话框，供您更改断点类型和断点详细信息。
或者，您也可以在代码编辑器中选择断点行，然后在 Linux 上输入 Control+Alt+b，在 Mac 上输入 Command+Alt+b，以打开断点修改对话框。
您还可以将鼠标悬停在边栏中的断点上，快速仔细检查条件或日志点日志：
总结
我们重新设计断点边栏的目标是让使用断点进行调试变得更加轻松。最重要的是，我们旨在让内容更有条理，更易于访问和理解。我们希望这些改进能帮助您在下一次调试会话中取得更好的效果！
如果您有关于进一步改进的建议，请提交 bug，告诉我们！
下载预览渠道
不妨考虑使用 Chrome Canary、开发者版或 Beta 版作为默认开发浏览器。这些预览渠道可让您访问最新的开发者工具功能，测试尖端的 Web 平台 API，并帮助您在用户之前发现网站上的问题！
与 Chrome 开发者工具团队联系
您可以使用以下选项讨论新功能、更新或与 DevTools 相关的任何其他内容。
- 在 crbug.com 上向我们提交反馈和功能请求。
- 在 DevTools 中使用 更多选项 > 帮助 > 报告 DevTools 问题 来报告 DevTools 问题。
- 在 Twitter 上向 @ChromeDevTools 发送推文。
- 在 DevTools 新变化 YouTube 视频或 DevTools 提示 YouTube 视频中发表评论。