JS调试必备的debug调试javascript技巧

1. debugger;

我以前也说过,你可以在JavaScript代码中加入一句debugger;来手工造成一个断点效果。
需要带有条件的断点吗?你只需要用if语句包围它:

复制代码 代码如下:
if (somethingHappens) {
debugger; }

但要记住在程序发布前删掉它们。

2. 设置在DOM node发生变化时触发断点

有时候你会发现DOM不受你的控制,自己会发生一些奇怪的变化,让你很难找出问题的根源。

谷歌浏览器的开发工具里有一个超级好用的功能,专门可以对付这种情况,叫做“Break on…”,你在DOM节点上右键,就能看到这个菜单项。

断点的触发条件可以设置成这个 节点被删除、节点的属性有任何变化,或它的某个子节点有变化发生。

3. Ajax 断点

XHR断点,或Ajax断点,就像它们的名字一样,可以让我们设置一个断点,在特点的Ajax调用发生时触发它们。

当你在调试Web应用的网络传输时,这一招非常的有效。

技术交流QQ群:15129679

JS调试必备的5个debug技巧_javascript技巧的更多相关文章

  1. JS调试必备的5个debug技巧

    我一直使用printf调试程序,一般来说都是比较顺利,但有时候,你会发现需要更好的方法.下面几个JavaScript技巧相信你一定会觉得十分有用   1. debugger; 我以前也说过,你可以在J ...

  2. 必备的JS调试技巧汇总

    转自http://www.jb51.net/article/88891.htm 前言:任何一个编程者都少不了要去调试代码,不管你是高手还是菜鸟,调试程序都是一项必不可少的工作.一般来说调试程序是在编写 ...

  3. 前端开发中的JS调试技巧

    前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...

  4. 【转】天啦噜!原来Chrome自带的开发者工具还能这么用!(提升JS调试能力的10个技巧)

    天啦噜!原来Chrome自带的开发者工具还能这么用! (提升JS调试能力的10个技巧)   Chrome自带开发者工具.它的功能十分丰富,包括元素.网络.安全等等.今天我们主要介绍JavaScript ...

  5. 一探前端开发中的JS调试技巧

    前言 调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问题.降低故障概率.帮助分析逻辑错误等等.而在互联网前端开发越来越重要的今 ...

  6. 【repost】一探前端开发中的JS调试技巧

    有请提示:文中涉及较多Gif演示动画,移动端请尽量在Wifi环境中阅读 前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问 ...

  7. 一探前端开发中的JS调试技巧(转)

    有请提示:文中涉及较多Gif演示动画,移动端请尽量在Wifi环境中阅读 前言:调试技巧,在任何一项技术研发中都可谓是必不可少的技能.掌握各种调试技巧,必定能在工作中起到事半功倍的效果.譬如,快速定位问 ...

  8. js调试系列: 调试基础与技巧

    js调试系列目录: - 昨天我们见识到了断点的强悍,在断点的配合下进行动态调试,让读代码变的轻松不少,特别是ajax之类的.在昨天的课后练习中,确实增加了不少难度,因为 提交评论 按钮是用 jQuer ...

  9. sublime text配置node.js调试

    1. 首先到 nodejs.org 下载 Node.js 安装包并安装.2. 打开 Sublime Text 2 编辑器.选择菜单 Tools --> Build System --> n ...

随机推荐

  1. AI 实验--v_JULY_v

    http://blog.csdn.net/v_JULY_v http://www.julyedu.com/

  2. Python yield使用

    https://www.ibm.com/developerworks/cn/opensource/os-cn-python-yield/ 您可能听说过,带有 yield 的函数在 Python 中被称 ...

  3. SQL Server 2000 绿色精简版gsql适用于xp/win7/win8/win10

    老的程序员肯定都用过sql2000数据库,我在2006-2010年之间,做的不少网站也都是sql2000数据库的,但是后来随着mysql的兴起,就逐渐不再使用sql数据库了.但是最近有个客户的网站要修 ...

  4. ASP.NET MVC异步验证是如何工作的03,jquery.validate.unobtrusive.js是如何工作的

    在上一篇"ASP.NET MVC异步验证是如何工作的02,异步验证表单元素的创建"中了解了ASP.NET异步验证是如何创建表单元素的,本篇体验jquery.validate.uno ...

  5. 详细解读Volley(二)—— ImageRequest & Request简介

    上篇文章我们讲到了如何用volley进行简单的网络请求,我们可以很容易的接受到string.JsonObjec类型的返回结果,之前的例子仅仅是一次请求,这里需要说明volley本身就是适合高并发的,所 ...

  6. JAVA垃圾回收机制概要

    垃圾回收是JAVA中的一个大知识点,也是一个著名知识点,毕竟JAVA号称自己先进性的时候总是会带上垃圾回收.于是,它也成了面试中的常客,面试官动不动的就要你解释下什么是垃圾回收,以及它的原理是什么.当 ...

  7. [转]Win7与虚拟机VMware下运行的Ubuntu共享文件夹

    From : http://blog.csdn.net/gaojinshan/article/details/9231853 安装VMware Tools,在VMware面板上选择“虚拟机-重新安装V ...

  8. Guava ClassToInstanceMap

    概述 ClassToInstanceMap提供了一种是用Class作为Key, 对应实例作为Value的途径.他定义了T getInstance(Class<T>)和T putInstan ...

  9. query多选下拉框插件 jquery-multiselect(修改)

    其实网上关于该控件的使用教程已经很多了,其中 query多选下拉框插件 jquery-multiselect Jquery多选下拉列表插件jquery multiselect功能介绍及使用 这2个的介 ...

  10. HTML中的转义字符 (转)

    HTML中<, >,&等有特殊含义,(前两个字符用于链接签,&用于转义),不能直接使用.使用这三个字符时,应使用它们的转义序列,如下所示: & 或 & &a ...