推荐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 相关文章推荐
JS取文本框中最小值的简单实例
Nov 29 Javascript
老生常谈 js中this的指向
Jun 30 Javascript
浅谈js构造函数的方法与原型prototype
Jul 04 Javascript
jQuery深拷贝Json对象简单示例
Jul 06 Javascript
node.js利用redis数据库缓存数据的方法
Mar 01 Javascript
Bootstrap警告框(Alert)插件使用方法
Mar 21 Javascript
jQuery实现的粘性滚动导航栏效果实例【附源码下载】
Oct 19 jQuery
JS基于封装函数实现的表格分页完整示例
Jun 26 Javascript
vue表单自定义校验规则介绍
Aug 28 Javascript
axios全局注册,设置token,以及全局设置url请求网段的方法
Sep 25 Javascript
javascript获取元素的计算样式
May 24 Javascript
JavaScript链式调用原理与实现方法详解
May 16 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 object转数组示例
2014/01/15 PHP
php实现与python进行socket通信的方法示例
2017/08/30 PHP
jquery的extend和fn.extend的使用说明
2011/01/09 Javascript
javascript生成json数据简单示例分享
2014/02/14 Javascript
JavaScript利用构造函数和原型的方式模拟C#类的功能
2014/03/06 Javascript
js和jQuery设置Opacity半透明 兼容IE6
2016/05/24 Javascript
AngularJs ng-repeat 嵌套如何获取外层$index
2016/09/21 Javascript
详解Angular 开发环境搭建
2017/06/22 Javascript
vue jsx 使用指南及vue.js 使用jsx语法的方法
2017/11/11 Javascript
详解webpack-dev-server 设置反向代理解决跨域问题
2018/04/18 Javascript
JavaScript基础教程之如何实现一个简单的promise
2018/09/11 Javascript
微信小程序 image组件遇到的问题
2019/05/28 Javascript
vue实现在进行增删改操作后刷新页面
2020/08/05 Javascript
[01:03:27]NAVI vs EG 2019国际邀请赛小组赛 BO2 第一场 8.15
2019/08/17 DOTA
python使用calendar输出指定年份全年日历的方法
2015/04/04 Python
基于Python实现的百度贴吧网络爬虫实例
2015/04/17 Python
常见的python正则用法实例讲解
2016/06/21 Python
python编写Logistic逻辑回归
2020/12/30 Python
利用 python 对目录下的文件进行过滤删除
2017/12/27 Python
详解python使用turtle库来画一朵花
2019/03/21 Python
MxNet预训练模型到Pytorch模型的转换方式
2020/05/25 Python
Python如何在windows环境安装pip及rarfile
2020/06/15 Python
python openCV实现摄像头获取人脸图片
2020/08/20 Python
简单掌握CSS3中resize属性的用法
2016/04/01 HTML / CSS
Html5与App的通讯方式详解
2019/10/24 HTML / CSS
欧洲领先的电子和电信零售商和服务提供商:Currys PC World Business
2017/12/05 全球购物
哥伦比亚加拿大官网:Columbia Sportswear Canada
2020/09/07 全球购物
工程现场管理求职自荐信
2013/10/02 职场文书
医学专业毕业生推荐信
2013/11/14 职场文书
专科应届生求职信
2013/11/24 职场文书
国贸专业个人求职信范文
2014/01/08 职场文书
致短跑运动员广播稿
2014/01/09 职场文书
人事部岗位职责范本
2014/03/05 职场文书
公司搬迁通知
2015/04/20 职场文书
《半截蜡烛》教学反思
2016/02/19 职场文书
2020年个人安全保证书参考模板
2020/01/08 职场文书