发布日期:2016-05-26 14:32:25

现代javascript有很多方法,这里列出一些常用方法:

方法一: 通过console.log()来打印调试信息。

(需要浏览器支持,不过大部分浏览器都支持。)

SMART.utils.LOG = new SmartUtils.Class();
SMART.utils.LOG.extend({
	DEBUG:0,
	INFO:1,
	ERROR:2,
	_level:2,
	_status:0,
	
	init: function(){
		this._level = this.ERROR;
		this._status = 0;
	},
	
	setLogLevel: function(level){
		this._level = level;
	},
	
	debug: function(msg){
		if(this.isEnabled() && this._level <= this.DEBUG){
			console.log(msg);
		}
	},
	
	info:function(msg){
		if(this.isEnabled() && this._level <= this.INFO){
			console.log(msg);
		}
	},
	
	error:function(msg){
		if(this.isEnabled() && this._level <= this.ERROR){
			console.log(msg);
		}
	},
	
	isEnabled: function(){
		return this._status;
	},
	
	enableLog: function(){
		this._status = 1;
	},
	
	disableLog: function(){
		this._status = 0;
	}
});

var AppLog = new SMART.utils.LOG();
AppLog.enableLog();

AppLog.debug("Debug Info here............");

方法二:通过关键字debugger来设置断点。

var x = 15 * 5;
debugger;
document.getElementbyId("test").innerHTML = x;

方法三:通过浏览器提供的调试窗口设置断点。

方法四:设置DOM断点来监听DOM结构的变化,包括子树的修改,节点的移除,属性的修改

方法五: 针对Ajax请求的调试(Source->XHR Breakpoints -> Add breakpoint )

方法六:正对不同设备的调试(样式调试-> Toggle Device Mode来选择设备)

发表评论