不得不说的Firebug（二）：Firebug——控制台（Console）

    本篇博文打算总结一下Firebug中的控制台这一个Tab，控制台（Console）是Firebug的第一个面板，也是最重要的面板，主要作用是显示网页加载过程中产生各类信息。下面对其进行介绍，希望对大家有所帮助，有错误之处也希望大家能指出来。

一、显示信息的命令

在调试JavaScript的过程中，我们以往可能很多人会用alert(‘’);或者document.write(‘’);来输出一些信息，但是现在用Firebug的一个内置对象console的一些方法会更加直观地显示信息。Console()有以下几种显示信息的方法：

1、console.log():不带图标的普通信息。

2、console.debug():不带图标除错信息。

3、console.error():带图标的错误提示。

4、console.info():带图标的一般信息。

5、console.warn();带图标的警告提示。

示例：

<script language="javascript" type="text/javascript">

console.log('This is log message');

console.debug('This is debug message');

console.error('This is error message');

console.info('This is info message');

console.warn('This is warning message');

</script>

①、将上述代码整一个拷贝进HTML文件里。命名为test.html，打开这个HTML文件可以看到控制台有以下记录：

可以看到，不同性质的信息前面有不同的图标，并且每条信息后面都有超级链接，点击后跳转到网页源码的相应行。对于错误的信息，还会显示错误在哪一行代码，并且代码有超链接，点击可直接定位到文件里的那行代码中。

②、将以上中间的JavaScript代码片段拷贝到debug调试窗口

③、将以上中间的JavaScript代码片段拷贝到debug调试窗口

也可以点击编辑器右边按钮切换成按回车键逐行输入的命令行，切换成按回车键逐行输入的命令行

二、占位符

console对象的上面5种方法，都可以使用printf风格的占位符。不过，占位符的种类比较少，只支持字符（%s）、整数（%d或%i）、浮点数（%f）和对象（%o）四种。

%s	字符串
%d, %i	整型
%f	浮点型
%O	对象
%o	Dom元素
%c	CSS样式，注意不是字符

示例：

<script language="javascript" type="text/javascript">

console.log("今天是%s%i年%d月%d日,温度为%f。", "公元", 2014, 7, 31, 31.5);
 
function Dog(){

    this.BigDog = function(){

         return "a Big Dog";

    }

    this.SmallDog = function(){

         return "a Small Dog";

    }

}


var dog = new Dog();

console.log('This is a %o !', dog);
 
</script>

①、将上述代码整一个拷贝进HTML文件里。命名为test.html，打开这个HTML文件可以看到控制台有以下记录：

②、将以上中间的Javascript代码片段拷贝到debug调试窗口运行后控制台的效果一样。

三、分组显示

如果信息太多，可以分组显示，用到的方法是console.group()和console.groupEnd()。

示例：

<script language="javascript" type