使用Google Chrome逐行调试Javascript

如何使用Google Chromes developer工具逐行遍历javascript代码，而不将其放入javascript库

例如，我在我的站点上大量使用jQuery，我只想调试我编写的jQuery，而不是jQuery库中的javascript/jQuery。我如何只需逐步完成自己的jquery/javascript，而不必逐步完成jquery库中的数百万行

因此，如果我有以下几点：

function getTabFrame() {
    $.ajax({
        url: 'get_tab_frame.aspx?rand=' + Math.random(),
        type: 'GET',
        dataType: 'json',
        error: function(xhr, status, error) {
            //alert('Error: ' + status + '\nError Text: ' + error + '\nResponse Text: ' + xhr.responseText);
        },
        success: function(data) {
            $.each(data, function(index, item) {
                // do something here
            });
        }
    });
}

如果我把断点放在

$.ajax（{

），如果我让他们开始调试它，如果我按下F11，它就会直接进入jQuery库。我不希望发生这种情况，我希望它转到下一行，那就是

url:'get_tab_frame.aspx？rand='+Math.random（），

---

我试着按F10键，但这会直接进入函数的结束部分。F5只会进入下一个断点，而不会一行一行地进行操作。

假设您在Windows计算机上运行

按

F12

键

在开发人员工具中选择

脚本

，或

源

，选项卡

单击顶层的小文件夹图标

选择您的JavaScript文件

通过单击左侧的行号添加断点（添加一个蓝色标记）

执行您的JavaScript

然后在执行调试期间，您可以执行一些步进动作

• F8

  Continue：将继续，直到下一个断点

• F10

  Step over：下一次函数调用的步骤（不会进入 图书馆）

• F11

  单步执行：单步执行下一个函数调用（will （进入图书馆）

• Shift+F11

  Step out（步出）：步出当前 作用

更新

阅读您的最新帖子后，若要调试您的代码，我建议暂时使用。虽然这不能直接解决您的问题，但它将使您能够更轻松地进行调试。对于您试图实现的目标，我相信您需要进入库，因此希望生产代码能够帮助您了解发生的情况。

…如何使用Google Chromes developer工具逐行遍历javascript代码，而不将其放入javascript库

---

作为记录：在这个时候（2015年2月），Google Chrome和Firefox都有你（和我）所需要的，以避免进入库和脚本，并超越我们感兴趣的代码，这被称为黑盒：

当您黑盒源文件时，调试器将不会跳转到该文件中 当单步执行正在调试的代码时

更多信息：

• 铬：
• 火狐：

---

什么时候你主要遇到问题？当你遇到异常时？基本上，我有太多的javascript，以至于我无法再在脑海中看到它的结构，所以我只想一步一步地浏览我自己的代码，提醒自己如何找出问题所在…这听起来非常类似于你需要的答案。你知道吗可能也会发现这一点很有用：请查看我问题中的其他信息，以给出一个示例。我感觉Google Chrome的开发工具不可能逐行逐行进行类型调试？我已经更新了我的答案，希望它会有更大的帮助。除非我大错特错，在Chrome开发工具中，我相信F5会刷新页面；F8是继续键，不是吗？F5也会继续，直到最后，如果我的js代码在Html文件中，它会刷新。对了，这对调试非常有用，谢谢。