几乎99%的web前端开发人员都是用firebug来调试JavaScript程序，如果你没听过firebug，那赶紧google下吧。我喜欢用console.log() 来输出调试信息到firebug的控制台。这肯定是比用alert()来弹出调试信息好用得多。下面这个例子演示的是如何在html里使用console.log() 这个方法：
<html>
<head>
<script type="text/javascript">
function demo() {
// do something
console.log("I'm here!");
// do something
}
</script>
</head>
<body>
<h1>Firebug's console.log() Demo</h1>
<button οnclick="demo();">Firebug console.log() demo</button>
</body>
</html> 上面的代码有一个按钮元素，将打印出信息，“I’m here！”到Firebug的控制台。
当然，这前提是你的Firefox浏览器安装了firebug插件，并已经激活使用,否则会报错说：console object is not defined.
但是，当网站正式上线，部署到服务器上时，你并不希望用户看到这些调试信息。因为如果没有安装firebug的话，会导致JavaScript错误。
而解决这个问题，我觉得有2个解决方法：
- 在部署的时候手动搜索删除所有的console调试信息。（这个工作量很大，而且很繁琐）
- 增加一个方法来控制调试状态，如声明一个全局变量DEBUG来判断是否开启console功能。（推荐）
对于第二个解决方法，可以参考如下这个例子：
<html>
<head>
<script type="text/javascript">
DEBUG = true;
// by default, set mylogger to do nothing
mylogger = {};
mylogger.log = function(msg) {
return false;
};
// if DEBUG is true and Firebug console is available, use it for logging
if (window.DEBUG && typeof(console) !== 'undefined') {
mylogger = console;
}
function demo() {
// I did lots of things here
mylogger.log("I'm here!");
// and a lot more
}
</script>
</head>
<body>
<h1>Firebug's console.log() Demo</h1>
<button οnclick="demo();">Firebug console.log() demo</button>
</body>
</html>上面代码有一个调试开关DEBUG，在测试时可以设置这个变量来决定是否开启firebug的功能。同时用一个新的对象“继承”console，来判断console是否存在，防止JavaScript报错。
6452
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
