DevTools 许可内涵履行过程中暂停代码，并在此时检查所有变量的值。 暂停代码的对象称为断点。 如今就尝尝：

• 返回例子并按 Command + Option + I(Mac)或 Control + Shift + I(Windows，Linux)打开DevTools。
• 点击 Sources 面板。
• 点击 Event Listener Breakpoints 打开该面板。DevTools 展示了所有事宜的列表， 例如 Animation 和 Clipboard。
• 然后找到 Mouse 事沂攀类别，点击打开该列表。
• 选中 click 复选框。

console.log() 的另一个替代办法是控制台。可以应用控制台来评估随便率性的 JavaScript 语句。 开辟人员平日应用控制台在调试时覆盖变量值。 在您的情况下，控制台可以赞助找到啊修复 bug 的办法。 如今就尝尝：

• 如不雅您没有打开控制台抽屉，请按 Esc 键将其打开。 它将在您的 DevTools 窗口的底部打开。
• 在控制台中，输入 parseInt(addend1)+ parseInt(addend2)。
• 按回车。 DevTools 履行该语句并打印出 “6”，这是您期望演示生成的结不雅。  

步调 6：修复

您已经肯定了该 bug 的潜在修复办法。 剩下的是经由过程编辑代码并从新运行演示来测验测验修复。 您不须要分开 DevTools 来修复 bug。 您可以直接在 DevTools UI 中编辑 JavaScript 代码。 如今就尝尝：

1. 在 DevTools 的 Sources 面板，用 var sum = parseInt(addend1) + parseInt(addend2); 调换 var sum = addend1 + addend2;，这是您当前暂停的一行。
2. 按 Command + S(Mac)或 Control + S(Windows，Linux)保存更改。 代码的背景更改为红色，表示脚本已在DevTools 中更改。
3. 点击 Deactivate breakpoints 按钮，它变蓝色表示它是激活的。DevTools 忽视您设置的任何断点。
4. 点击 Resume script execution 按钮，测验测验应用不合的变量，如今 sum 可以精确计算了。 

【编辑推荐】

1. 25个最根本的JavaScript面试问题及谜底
2. 30行JavaScript代码，教你分分钟创建神经收集
3. WordPress 核心 JavaScript 框架选择评论辩论话题持续进行
4. 10 个最终编译成 JavaScript 的脚本说话
5. Java开辟者的福音：应用 Visual Studio Code 调试 Java 应用法度榜样

　　推荐阅读

　　天才李一男年底出狱：任正非接班人27岁当华为副总，因750万入狱

神童”李一男将近出狱了。在被捕之前，他头顶诸多光环，是常人难以企及的技巧天才：15岁考入华中理工大年夜学少年班，27岁成为华为公司的副总裁、传闻中的任正非交班>>>详细阅读

本文标题：使用Chrome DevTools调试JavaScript

地址：http://www.17bianji.com/lsqh/37716.html

 1/2    1