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. STM32F4 Alternate function mapping

    #define GPIO_AF0_MCO // MCO (MCO1 and MCO2) Alternate Function mapping #define GPIO_AF0_RTC_50Hz // ...

  2. Git 忽略某个目录中的文件,同时保留这个目录

    类似的一个问题是项目根目录下可能有 logs 一类的目录, 我们希望他人把仓库 clone 下来的时候能够已经携带了这个目录, 但又不希望让这个目录中的日志文件进版本库. 之前看到一些项目用了一种比较 ...

  3. 修復 “Failed to bring up eth0″ in Ubuntu virtualbox

    参考文献: 修復 “Failed to bring up eth0″ in Ubuntu VMWare ubuntu下smokeping安装配置 背景 从同事那边拷贝了一个virtualbox虚拟机过 ...

  4. win10镜像重装,快速设置之后无限重启怎么办?

    我得操作过程: 1.下载老毛桃最win8pe装机版 2.安装老毛桃到U盘, 3.格式化U盘,用extFat格式,拷贝win10镜像文件(你也可以拷贝到硬盘上) 4.插入电脑,通过U盘启动,进入PE 5 ...

  5. Spring Boot开发之流水无情(二)

    http://my.oschina.net/u/1027043/blog/406558 上篇散仙写了一个很简单的入门级的Spring Boot的例子,没啥技术含量,不过,其实学任何东西只要找到第一个突 ...

  6. android开发:全屏和退出全屏

    android开发:全屏和退出全屏 from://http://blog.csdn.net/dyllove98/article/details/8831933 2013-04-21 20:31 413 ...

  7. windows 下运行 UglifyJS

    Node 0.52版本支持windows,因此UglifyJS可以在windows上运行,下面简介他的方法: 1.下载node.exe,现在最新版本0.52,他的官网http://nodejs.org ...

  8. anaconda、pip配置国内镜像

    一.anaconda配置镜像查看源:conda config --show-sources在Mac and Linux下:conda config --add channels https://mir ...

  9. 基于图的图像分割(Graph-Based Image Segmentation)

    一.介绍 基于图的图像分割(Graph-Based Image Segmentation),论文<Efficient Graph-Based Image Segmentation>,P. ...

  10. SQLServer 日期函数大全 SQLServer 时间函数大全

    原文地址:https://www.cnblogs.com/zhangpengnike/p/6122588.html 一.统计语句 1.--统计当前[>当天00点以后的数据] SELECT * F ...