在WEB页面中添加调试程序

E587-2如何设计JS的debug调试程序?
1、在公共组件中定义log这个变量，因为所有的页面都会调用这个公共组件，因此，定义的参数也是“公有”的，即所有的JS文件中会使用这个全局变量来添加对应的日志信息
2、由于考虑到JS是在浏览器中作用，不需要对应的Server支撑，因此开发人员只需要在地址栏中添加参数告诉浏览器现在是要调试程序即可

 

function getQueryStringByName(item){
    var svalue = location.search.match(new RegExp("[\?\&]" + item + "=([^\&]*)(\&?)", "i"));
    return svalue ? svalue[1] : svalue;
}

var log = log4javascript.getNullLogger();
var _logEnable = getQueryStringByName("log");

if (_logEnable == "debug") 
{
    log.setLevel(log4javascript.Level.DEBUG);
}
else if (_logEnable == "trace") 
{
    log.setLevel(log4javascript.Level.TRACE);
}
log.debug("MAIN : entered " + window.location.href);

  

 问题1：直接在地址栏中输入?log="debug"
返回的结果有debug字符串，但是if (_logEnable == "debug") 为false，不能进入
1、alert(_logEnable)的结果为debug，这就是“灵异”事件
2、测试_logEnable的类型 alert(typeof(_logEnable))和alert(typeof "debug")，两个都为string
3、类型一样，最后怀疑字符串的长度，如果存在空格，使用alert是不显示出来的，这样测试alert(_logEnable.length)，结果为7
所以(_logEnable == "debug") 为false的原因找到了
上面这样的情况很隐蔽，因此要细心查找

使用脱机页面，在地址栏中添加“?log=debug”，页面无法预期显示debug的调试内容？
1、在脱机的代码中添加一个链接——链接本地页面，只是多了"?log=debug"这个参数，页面能够达到预期的目的显示debug调试的内容
2、比对直接打开页面的地址和自己添加链接的地址，发现自己添加的地址前面多了"file:\\\"这个字符串
3、因为浏览器自己会根据前面的协议去做相关的解析，类似于使用href链接，如果前面有http这个链接，则显示相对路径，如果没有这个，则显示相对路径
4、这个就是对应的协议，浏览器自己会根据这个“头协议”去做判断

延伸：起初在设计log的时候就应该定义一个规则，在什么样的情况下就要记录log，这样就能够根据不同的参数显示不同的内容。
例如：log = trace;显示的就是全部server反馈给ui的信息内容
   log = debug;显示的内容就是向server发送的请求