Javascript调试技巧，有经验的讲讲呗！

V2EX = way to explore

V2EX 是一个关于分享和探索的地方

现在注册

已注册用户请登录

这是一个创建于 4513 天前的主题，其中的信息可能已经有所发展或是发生改变。

这里不是指调试工具的使用，比如firebug或者chrome的F12 。
当js脚本很少的时候，一目了然，但是分析一个大型网站的js的时候，比如qq空间。快速定位，以及断点的设置，都是DOM的，你们的技巧谈谈啊。。

调试

技巧

6 条回复 1970-01-01 08:00:00 +08:00

jiyinyiyong

2013-06-10 21:24:22 +08:00

Google IO 历年视频里都有讲 Chrome JS 调试的, 我就从那学的
至于分析大网站的 JS, 因为时压缩过的, 我还没学会.. 求助楼下

TheMan

2013-06-11 08:09:01 +08:00 via Android

@jiyinyiyong 压缩过的，chrome调试器有个格式化工具，下方 {}这种形式的按钮

January

2013-06-11 08:22:19 +08:00

@TheMan 但是变量和函数命名就破不了了吧?

chemzqm

2013-06-11 08:51:53 +08:00

花那么大功夫研究人家大网站的前端逻辑不如去听听分享会，而且那些大站的代码组织方式往往不适合小站

jiyinyiyong

2013-06-11 09:11:23 +08:00

@TheMan 这不够的. 大公司代码加上框架很多层调用, 压缩后基本猜不出原来的语义

jjlovegrape

2013-06-11 12:24:17 +08:00

用chrome的开发者工具。
我的经验：
1.如果是DOM出问题，可以先找到对应的dom节点
2.在js里搜索DOM对应的选择器$('#someID')
3.单步调试。

可以结合网络抓包，有时候问题比较难定位的时候可以二分法找BUG。

另外真心不建议你去读空间的代码。

github上优秀的源代码很多，无聊可以试试读一下seajs的，玉伯的代码读了还是能长见识的。
https://github.com/seajs/seajs

.wwads-cn { border-radius: 3px !important; } .wwads-text { color: var(--link-color) !important; }