每次用alert输出信息,信息量小,调试不方便,有这样一个方法,能更好的写js代码,因为用Jquery较多,所以只写了Jquery的调试方法,还可以依据自己的喜好,在调试信息前加时间,
修改后将调试信息输出到可以缩放悬浮框中,下面有附图,
/**
* 打印JavaScript调试信息,定位使用绝对定位,每次打印的信息空一行
*/
function plInfo(obj){
if($("#show").length==0){
$("body").append("<div id=\"show\" style=\"position:fixed;left0px;top:0px;width:200px;height:500px;" +
"background-color:#F0F8FF;line-height:14px;font-size:12px;color:#456;z-index:200;overflow:auto;\"></div>");
$("#show").append("<div id=\"show_title\" style=\"width:200px;height:20px;" +
"line-height:20px;background-color:#7FFFD4;text-align:center;\">关闭js调试信息</div>");
$("#show").append("<div id=\"show_content\" style=\"padding-left:3px;display:block;\"></div>");
}
$("#show_content").append(obj+"<br /><br />");
$("#show_title").mouseup(function(){
//alert("block"==$("#show_content").css("display"));
if("block"==$("#show_content").css("display")){
$("#show_content").css("display","none");
$("#show").css("height","20px");
$("#show_title").html("查看js调试信息");
}else if("none"==$("#show_content").css("display")){
$("#show_content").css("display","block");
$("#show").css("height","500px");
$("#show_title").html("关闭js调试信息");
}
event.stopPropagation();//阻止事件冒泡
});
}