使用firebug很长一段时间了,但只是inspect一些DOM,调试JS、Ajax,都没用到Firebug的Console API。如果你跟我一样有对脚本调试中经常需要alert感到厌烦了,我想有必要和我一起了解下Firebug的console API。
来认识一下console.log,在测试文件脚本区域我们输入一下代码:
console.log(’Hello,firebug’);
显示如图:
console.log也可以象c语言的printf一样实现格式化输出。
console.log(’Console var i:%d’, i);
console.log还可以连续输出多个对象,而且如果对象是DOM、函数,可以直接点击去到该对象。
console.log(2,4,window, test, document);
Console还有其他的方式,通过不同的背景颜色和文字颜色来显示信息,如console.debug、 console.info、 console.warn和console.error。
效果如下:
有时候,我们还需要写一个for循环列出一个对象的所有属性或者某个HTML Element下的所有节点,有了firebug后,我们不需要再写这个for循环了,我们只需要使用console.dir(object)或console.dirxml(element)就可以了。
console.dir(document.getElementById(’divdemo’));
console.dirxml(document.getElementById(’divdemo’));
是否想知道代码的运行速度?很简单,使用console.time和console.timeEnd就可以。
function test(){
console.time(’test’);
for (var i = 0 ; i < 1000; i++){
document.getElementById(’div2′).innerHTML = i;
}
console.timeEnd(’test’);
}
是否想知道某个函数是从哪里调用的?console.trace可帮助我们进行追踪。在test函数的结尾加入:
console.trace();