推荐5 个常用的JavaScript调试技巧


Posted in Javascript onJanuary 08, 2015

我之前使用过用printf debugging,自此之后我用这种方法似乎总能更快地解决bug。
在某些情况下需要更好的工具,下面是其中的一些佼佼者,我敢肯定你会发现它们的有用之处:

1. debugger;

你可以使用“debugger;”语句在代码中加入强制断点。
需要断点条件吗?只需将它包装它在IF子句中:

if (somethingHappens) {

debugger;

}

只需记住在上线前移除。

2. 当节点变化时断开

有时DOM像有了自己的想法。当不可思议的变化发生时很难找到问题的根源。
Chrome开发人员工有调试这个问题的超级有用技能。这就是所谓的“Break on…”,你可以通过在元素选项卡上右键DOM节点找到它。

断点可以在节点被删除后设置,当节点的属性更改或者其子树中的节点变化时。
推荐5 个常用的JavaScript调试技巧

3. Ajax断点

XHR断点或我称作的Ajax断点,也允许当一个预期Ajax请求创建时断开。
当调试你的web应用的网络时这是个让人吃惊的工具。
推荐5 个常用的JavaScript调试技巧

4. 模拟不同的移动设备

Chrome增加了内置的移动设备模拟工具,这将简化你的日常工作。
选择任何非Console的选项卡找到它们,按键盘上的esc键并选择你想摸你的移动设备。

你当然不会得到一个真正的iPhone,但尺寸、触摸事件和agemt都会为你效仿。
推荐5 个常用的JavaScript调试技巧

5. 通过审核提升你的站点

YSlow是个伟大的工具。Chrome也在开发人员工具下包含一个称作Audits的类似工具。
使用快速审核一下你的网站,来获得有用实际的优化技巧。
推荐5 个常用的JavaScript调试技巧

还有什么呢?

没有这些工具我不能想象如何开发。当我发现新的后我会发布更多,敬请期待。

Javascript 相关文章推荐
ExtJS Window 最小化的一种方法
Nov 18 Javascript
javascript垃圾收集机制与内存泄漏详细解析
Nov 11 Javascript
JavaScript中的pow()方法使用详解
Jun 15 Javascript
灵活的理解JavaScript中的this指向
Feb 25 Javascript
html判断当前页面是否在iframe中的实例
Nov 30 Javascript
老生常谈jquery中detach()和remove()的区别
Mar 02 Javascript
vue组件如何被其他项目引用
Apr 13 Javascript
Vue和Bootstrap的整合思路详解
Jun 30 Javascript
微信小程序实战篇之购物车的实现代码示例
Nov 30 Javascript
Vue 进入/离开动画效果
Dec 26 Javascript
简述JS控制台的使用
Jul 15 Javascript
使用vue-cli脚手架工具搭建vue-webpack项目
Jan 14 Javascript
jQuery中prevUntil()方法用法实例
Jan 08 #Javascript
jQuery中prevAll()方法用法实例
Jan 08 #Javascript
jQuery中prev()方法用法实例
Jan 08 #Javascript
深入探密Javascript数组方法
Jan 08 #Javascript
用模版生成HTML的的框架jquery.tmpl使用详解
Jan 07 #Javascript
jQuery中parentsUntil()方法用法实例
Jan 07 #Javascript
jQuery中parents()方法用法实例
Jan 07 #Javascript
You might like
php站内搜索并高亮显示关键字的实现代码
2011/12/29 PHP
php短址转换实现方法
2015/02/25 PHP
PHP 计算两个特别大的整数实例代码
2018/05/07 PHP
javascript css float属性的特殊写法
2008/11/13 Javascript
jquery 模板的应用示例
2013/11/12 Javascript
javascript制作的简单注册模块表单验证
2015/04/13 Javascript
跟我学习javascript的定时器
2015/11/19 Javascript
Javascript实现图片轮播效果(一)让图片跳动起来
2016/02/17 Javascript
微信小程序 本地存储及登录页面处理实例详解
2017/01/11 Javascript
神级程序员JavaScript300行代码搞定汉字转拼音
2017/05/20 Javascript
微信小程序 自定义Toast实例代码
2017/06/12 Javascript
Javascript 严格模式use strict详解
2017/09/16 Javascript
vue组件开发之用户无限添加自定义填写表单的方法
2018/08/28 Javascript
解决Vue+Electron下Vuex的Dispatch没有效果问题
2019/05/20 Javascript
浅谈vue异步数据影响页面渲染
2019/10/29 Javascript
[13:21]DOTA2国际邀请赛采访专栏:RSnake战队国士无双,Fnatic.Fly
2013/08/06 DOTA
[05:31]DOTA2英雄梦之声_第04期_光之守卫
2014/06/23 DOTA
[01:04:08]完美世界DOTA2联赛PWL S3 INK ICE vs GXR 第一场 12.16
2020/12/18 DOTA
关于Python中空格字符串处理的技巧总结
2017/08/10 Python
Django 开发调试工具 Django-debug-toolbar使用详解
2019/07/23 Python
使用Python的Turtle绘制哆啦A梦实例
2019/11/21 Python
tensorflow保持每次训练结果一致的简单实现
2020/02/17 Python
python+selenium+PhantomJS抓取网页动态加载内容
2020/02/25 Python
解决python运行启动报错问题
2020/06/01 Python
python collections模块的使用
2020/10/16 Python
网页布局中CSS样式无效的十个重要原因详解
2017/08/10 HTML / CSS
Html5嵌入钉钉的实现示例
2020/06/04 HTML / CSS
ECOSUSI官网:女式皮革背包
2019/09/27 全球购物
会计自荐书
2013/12/02 职场文书
邮政员工辞职信
2014/01/16 职场文书
会计学专业学生的求职信范文
2014/01/27 职场文书
幼儿园安全检查制度
2014/01/30 职场文书
2014年应届大学生毕业自我鉴定
2014/01/31 职场文书
小学生思想品德评语
2014/12/31 职场文书
民事申诉状范本
2015/05/20 职场文书
2016年八一建军节活动总结
2016/04/05 职场文书