Chrome的命令行调试工具-Javascript Debugger

原文http://d.hatena.ne.jp/Syunpei/20080904/1220500815
这篇文章介绍的很清楚了。喜欢用命令行的爱用这个,挺有意思的 :)

别名
命令
[code]
b break
bi break_info
br
break
bt
backtrace
c continue
f frame
h help
? help
s source
n next
p print
s step
so stepout[/code]
我译了一下他的演示过程:

JavaScript Debugger
attached to a. html
$ b reverseDisplay <---------- reverseDisplay方法设置断点
set breakpoint # 2
$ bt <---------- back trace显示(onclick → reverseDisplay了解被执行的情况)
Frames # 0 to # 1 of 2:
# 00 reverseDisplay () file:///C:/Documents and Settings/Administrator/desktop/a.html line 5 column 2(position 31)
# 01 #<an HTMLButtonElement>.Onclick(evt = #)file:///C:/Documents and Settings/Administrator/desktop/a.html line 17 column 9 (position 143)
$ bi 2 <------ 显示断点2的信息
id=2, hit_count=0, type=function, target=reverseDisplay
paused at breakpoint 2: reverseDisplay(), file:///C:/Documents and Settings/Administrator/Desktop/a.html
5: var input=document.getElementById( "input").value;
$ ls <---------- 显看源代码
3:
4: function reverseDisplay () (
>>>> var input = document.getElementById ( "input"). value;
6: var out = "";
7: for (var i = input.length - 1; i> = 0; i -) (
8: out + = input . charAt (i);
9: )
10: output (out);
11:)
$ n <---------- 前进1行
7: for (var i = input.length - 1; i> = 0; i -) (
$ p input <---------- 显示变量input的值
$ b :10 <---------- 设第10行为断点(#3).
set breakpoint #3
$ bi <---------- 显示全部断点信息
Num breakpoints: 2
id=2, hit_count=1, type=function, target=reverseDisplay
id=3, hit_count=0, type=script, target=file:///C:/Documents and Settings/Administrator/デスクトップ/a.html, line=9
$ c <---------- 继续执行到第10行
paused at breakpoint 3: reverseDisplay(), file:///C:/Documents and Settings/Administrator/デスクトップ/a.html
10: output(out);
$ s <---------- 步进到output方法
output(out=おえういあ), file:///C:/Documents and Settings/Administrator/デスクトップ/a.html
13: document.getElementById("output").textContent = out;
$ args <---------- 查看方法的参数
out = "おえういあ"
$ frame <----------查看当前的frame(output方法)
#0 output, file:///C:/Documents and Settings/Administrator/デスクトップ/a.html
13: document.getElementById("output").textContent = out;
$ frame 1 <----------查看frame1(reverseDisplay方法)
#1 reverseDisplay, file:///C:/Documents and Settings/Administrator/デスクトップ/a.html
10: output(out);
$ frame 2 <----------查看frame2(onclick方法)
#2 onclick, file:///C:/Documents and Settings/Administrator/デスクトップ/a.html
17: reverseDisplay();
$ bt 1 2 <----------反向跟踪frame 1~2
Frames #1 to #2 of 3:
#01 reverseDisplay() file:///C:/Documents and Settings/Administrator/デスクトップ/a.html line 10 column 2 (position 175)
#02 #<an HTMLButtonElement>.onclick(evt=# ) file:///C:/Documents and Settings/Administrator/デスクトップ/a.html line 17 column 9 (position 143)
$ so <---------- 步出output方法
reverseDisplay(), file:///C:/Documents and Settings/Administrator/デスクトップ/a.html
11: }
$ locals <---------- 查看本地变量
input = "あいうえお"
out = "おえういあ"
i = -1
$ c <---------- 继续执行、结束
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值