我一直使用printf调试程序,一般来说都是比较顺利,但有时候,你会发现需要更好的方法。下面几个JavaScript技巧相信你一定会觉得十分有用:

  1. debugger;

  我以前也说过,你可以在JavaScript代码中加入一句debugger;来手工造成一个断点效果。

  需要带有条件的断点吗?你只需要用if语句包围它:

  if (somethingHappens) {

  debugger;

  }

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

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

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

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

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

  3. Ajax 断点

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

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

  4. 移动设备模拟环境

  谷歌浏览器里有一些非常有趣的模拟移动设备的工具,帮助我们调试程序在移动设备里的运行情况。

  找到它的方法是:按F12,调出开发者工具,然后按ESC键(当前tab不能是Console),你就会看到第二层调试窗口出现,里面的Emulation标签页里有各种模拟设备可选。

  当然,这不会就变成了真正的iPhone,只是模拟了iPhone的尺寸,触摸事件和浏览器User Agent值。

  5. 使用Audits改进你的网站

  YSlow是一个非常棒的工具。谷歌浏览器的开发者工具里也有一个非常类似的工具,叫Audits。

  它可快速的审计你的网站,给你提出非常实际有效的优化你的网站的建议和方法。

  PS:复制的别人的;

要当好JavaScript程序员:5个debug技巧的更多相关文章

  1. 如何成为一个伟大的 JavaScript 程序员

    这篇文章主要概述在我5年工作经验的基础上,我成为优秀JavaScript开发人员所使用的技术和资源. 当前大多数Web开发人员面临着这样一个共同的问题:他们必须在多个不同的领域领先于他人——从数据库到 ...

  2. 为什么我要称自己为Javascript程序员

    Aaron Griffin写了一篇精彩的牢骚文章,主要是关于各种框架和它们能把程序员从主要业务编程中抽离出来的功能特征.概括一下他的主要论点,当你成为了一个“Rails程序员”,你使用的是一种易于理解 ...

  3. 初中级Javascript程序员必修学习目录

    很多人总感觉javascript无法入门,笔者在这里写一下自己的学习过程,以及个人认为的最佳看书过程,只要各位能按照本人所说步骤走下去,不用很长时间,坚持个3个月,你的js层级会提高一个档次,无他,唯 ...

  4. [JavaScript] 初中级Javascript程序员必修学习目录

    很多人总感觉javascript无法入门,笔者在这里写一下自己的学习过程,以及个人认 为的最佳看书过程,只要各位能按照本人所说步骤走下去,不用很长时间,坚持 个3个月,你的js层级会提高一个档次,无他 ...

  5. 以技术面试官的经验分享毕业生和初级程序员通过面试的技巧(Java后端方向)

    本来想分享毕业生和初级程序员如何进大公司的经验,但后来一想,人各有志,有程序员或许想进成长型或创业型公司或其它类型的公司,所以就干脆来分享些提升技能和通过面试的技巧,技巧我讲,公司你选,两厢便利. 毕 ...

  6. [转]成为优秀Java程序员的10大技巧

    转自:http://www.codeceo.com/article/10-good-java-programmer-tips.html Java程序员有许多应遵循的守则或最佳实践方式.本文概述了每个开 ...

  7. 程序员作图工具和技巧,你 get 了么?

    分享程序员常用的画图软件和小技巧 大家好,我是鱼皮. 说实话,我觉得做个程序员挺好的.日常工作有很多,写代码.对需求.写方案等等,但我最爱画图:流程图.架构图.交互图.功能模块图.UML 类图.部署图 ...

  8. JavaScript程序员必备的5个debug技巧

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

  9. 每个JavaScript程序员都需要知道的5个数组方法

    Array.forEach() .forEach() 方法能够方便的让你 遍历数组里的每个元素,你可以在回调函数里对每个元素进行操作..forEach()方法没有返回值,你不需要在回调函数里写retu ...

随机推荐

  1. win8.1中安装sql2014 0x800F0906 【 Error while enabling Windows feature : NetFx3, Error Code : -2146498298 】

    安装sql2012 需要安装net3.5  没有的话 安装不成功 Error while enabling Windows feature : NetFx3, Error Code : -214649 ...

  2. js基础练习二之简易日历

    今天学到了js基础教程3,昨天的课后练习还没来的及做,这个是类似简易日历的小案例,视频还没听完,今晚继续...... 先看效果图: 其实做过前面的Tab选项卡,这个就很好理解了,通过鼠标放在不同月份月 ...

  3. UI,切图,命名

    APP切图流程和APP切图命名规范详细完整版 http://www.25xt.com/appdesign/7339.html Marketch

  4. python学习笔记系列----(七)类

    7.1 python类和相关术语的简介 Python 通过最小的新语法和语义在语言中实现了类. 它是 C++ 或者 Modula-3 语言中类机制的混合.类的大多数重要特性都被完整的保留下来:类继承机 ...

  5. 闲鱼demo

    编程是一种美德,是促使一个人不断向上发展的一种原动力 -----–以下是正文------- 最近好多app的底部标签导航使用以下形式了,所以我们就来学习一下它是如何实现的. 先看效果: 中间的&quo ...

  6. 7. LAMP环境搭建

    一.准备工作 1.安装编译工具gcc.gcc-c++ 注意解决依赖关系,推荐使用yum安装,若不能联网可使用安装光盘做为yum源-- 1)编辑yum配置文件: # mount /dev/cdrom / ...

  7. fso查找被删除的文件

    <html> <head> </head> <body> 源目录:<input id="txtOld" value=" ...

  8. 山东省第七届ACM省赛------The Binding of Isaac

    The Binding of Isaac Time Limit: 2000MS Memory limit: 65536K 题目描述 Ok, now I will introduce this game ...

  9. cordova 打包发布正式版 apk

    cordova build android —release 笔者观察了一下新版Cordova,用的是gradle来build项目,所以网上的那些设置ant.properties的解决方法都排除掉,不 ...

  10. Duilib改进窗口拖动,使整个窗口都能拖动两种方法(转载)

    转载:http://www.cnblogs.com/XiHua/articles/3490490.html 转载:http://blog.csdn.net/lostspeed/article/deta ...