blob: 39c4b178a67b5f29fcca538f206ac969b0065285 (
plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
|
---
title: 调试器
slug: Tools/Debugger
tags:
- 工具
- 开发工具
- 火狐操作系统
- 调试器
- 调试技术
translation_of: Tools/Debugger
---
<div>{{ToolsSidebar}}</div>
<p>JavaScript Debugger允许单步调试，进入到你的Javascript代码中审查并修改相应的值，便于追踪缺陷。</p>
<p>{{EmbedYouTube("QK4hKWmJVLo")}}</p>
<p>你可以运用JS Debugger来调试并运行在远程或本地的代码，比如在火狐OS或安卓设备上。远程调试请查看 <em><u><a href="/en-US/docs/Tools/Remote_Debugging" title="/en-US/docs/Tools/Remote_Debugging">远程调试</a> </u></em>，来学习如何将调试器与远程目标连接起来 。</p>
<p>这里有一份<a href="/zh-CN/docs/Tools/Debugger/UI_Tour">快速指南</a>来帮助你熟悉JS Debugger的界面。</p>
<h2 id="如何使用？">如何使用？</h2>
<p>你可以参考以下文档来了解如何使用Debugger。</p>
<div class="twocolumns">
<ul>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Open_the_debugger">打开Debugger</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Pretty-print_a_minified_file">美化源代码</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Search">搜索</a></li>
<li><a href="/en-US/docs/Tools/Debugger/How_to/Use_a_source_map">使用source map</a></li>
</ul>
</div>
<h3 id="暂停执行">暂停执行</h3>
<p>有时你可能想暂停正在执行的代码，来了解代码的各个部分在做什么。为了告诉Debugger何时暂停执行，有以下多种不同的方法：</p>
<div class="twocolumns">
<ul>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Set_a_breakpoint">设置断点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Set_a_conditional_breakpoint">设置条件断点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/Set_an_XHR_breakpoint">设置XHR断点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/Set_event_listener_breakpoints">设置Event Listener断点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Breaking_on_exceptions">设置异常断点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Use_watchpoints">使用watchpoints</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/Break_on_DOM_mutation">设置DOM变化断点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Disable_breakpoints">禁用断点</a></li>
</ul>
</div>
<h3 id="控制执行">控制执行</h3>
<p>代码暂停执行之后能够做什么？</p>
<div class="twocolumns">
<ul>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Step_through_code">单步执行</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Black_box_a_source">忽略源代码</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/Debug_worker_threads">调试worker线程代码</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Debug_eval_sources">调试eval()中的代码</a></li>
</ul>
</div>
<h3 id="观察变量">观察变量</h3>
<p>在执行期间或暂停时，有时你可能会想观察变量或表达式的值。</p>
<ul>
<li><a href="/zh-CN/docs/Tools/Debugger/Set_a_logpoint">设置日志点</a></li>
<li><a href="/zh-CN/docs/Tools/Debugger/How_to/Set_Watch_Expressions">设置watch表达式</a></li>
</ul>
<hr>
<h2 id="参考">参考</h2>
<ul>
<li>
<p><a href="/zh-CN/docs/Tools/Debugger/Keyboard_shortcuts">Debugger键盘快捷键</a></p>
</li>
<li>
<p><a href="/zh-CN/docs/Tools/Debugger/Source_map_errors">Source map错误</a></p>
</li>
</ul>
|
