js调试method
2016-01-07 00:00
344 查看
摘要: js调试技巧和方法
在JavaScript代码中加入一句debugger;来手工造成一个断点效果
需要带有条件的断点,你只需要用if语句包围它
但要记住在程序发布前删掉它们。
console.log()能够输出变量,函数,数组,对象等等
断点的触发条件可以设置成这个节点被删除、节点的属性有任何变化,或它的某个子节点有变化发生。
当你在调试Web应用的网络传输时,这一招非常的有效。
按F12,调出开发者工具,然后按ESC键(当前tab不能是Console),你就会看到第二层调试窗口出现,里面的Emulation标签页里有各种模拟设备可选。
这不会就变成了真正的iPhone,只是模拟了iPhone的尺寸,触摸事件和浏览器User Agent值
它可快速的审计你的网站,给你提出非常实际有效的优化你的网站的建议和方法。
debugger;
debugger; console.log("值为:",fn);
在JavaScript代码中加入一句debugger;来手工造成一个断点效果
需要带有条件的断点,你只需要用if语句包围它
但要记住在程序发布前删掉它们。
console.log()能够输出变量,函数,数组,对象等等
设置在DOM node发生变化时触发断点
有时候你会发现DOM不受你的控制,自己会发生一些奇怪的变化,让你很难找出问题的根源。断点的触发条件可以设置成这个节点被删除、节点的属性有任何变化,或它的某个子节点有变化发生。
Ajax 断点
XHR断点,或Ajax断点,就像它们的名字一样,可以让我们设置一个断点,在特定的Ajax调用发生时触发它们。当你在调试Web应用的网络传输时,这一招非常的有效。
移动设备模拟环境
谷歌浏览器里有一些非常有趣的模拟移动设备的工具,帮助我们调试程序在移动设备里的运行情况。按F12,调出开发者工具,然后按ESC键(当前tab不能是Console),你就会看到第二层调试窗口出现,里面的Emulation标签页里有各种模拟设备可选。
这不会就变成了真正的iPhone,只是模拟了iPhone的尺寸,触摸事件和浏览器User Agent值
使用Audits改进你的网站
YSlow是一个非常棒的工具。谷歌浏览器的开发者工具里也有一个非常类似的工具,叫Audits。它可快速的审计你的网站,给你提出非常实际有效的优化你的网站的建议和方法。
相关文章推荐
- js 中的继承
- JavaScript 正则表达式上——基本语法
- 处理json工具类JacksonUtil
- javascript开发HTML5游戏--斗地主(单机模式part3)
- ExtJS远程数据-本地分页
- JavaScript:理解instanceof
- JavaScript 操作 Cookie
- javascript小白学习指南4--持续更新
- javascript attachEvent addEventListener 监听事件
- bzoj1031【JSOI2007】字符加密Cipher
- JS_ 垃圾回收、变量与属性、作用域链
- JS模块化规范CommonJS,AMD,CMD
- 什么是JS闭包
- JavaScript打字游戏 01
- JavaScript函数惰性载入
- 实现 jstl标签foreach 功能
- js中对字符串的处理
- TypeError: window.clipboardData is undefined
- JSON库之性能比较:JSON.simple VS GSON VS Jackson VS JSONP
- 仿百度图片浏览效果