Firebug插件 和 Chrome的JavaScript控制台 都有一个全局变量conslole .
console.log(object[, object, ...])
这样就能在控制台打印出 : Here is log!
console.log("Here is log!");
如果要输入的内容存在变量,可以用多个参数的方式实现:
var firstName = "Maple", familyName = "Jan";
console.log("My name is ", firstName, " ", familyName); // My name is Maple Jan
还可以像C语言那样使用占位符:
var firstName = "Maple", familyName = "Jan";
console.log("My name is %s %s", firstName, familyName); // My name is MapleJan
还可以这样写
var firstName = "Maple", familyName = "Jan", m = "m", a = "a", n = "n";
console.log("My name is %s %s. I am a ", firstName, familyName, m, a, n); // My name is Maple Jan. I am a m a n
FireFox的Firebug插件还支持css样式:
console.log('%cThis is red text on a green background', 'color:red; background-color:green');
但此功能在Chrome中不支持.
占位符:
| Pattern | Type |
| %s | String (字符串) |
| %d, %i | Integer (整数) |
| %f | Floating point number (浮点数) |
| %o | Object hyperlink (对象) |
| %c | Style formatting (CSS样式) |
console.debug(object[, object, ...])
debug 的输入和 log 输出的效果一样,但在Firebug中会被记录下来,可以在"调试信息"中找到.
debug 的输入和 log 输出的效果一样,但在Firebug中会被记录下来,可以在"调试信息"中找到.
console.info(object[, object, ...])
在Firebug中,输出信息的前面有蓝色感叹号的图标,会被记录到"消息"中.
console.warn(object[, object, ...])
Firebug和Chrome控制台中,输出信息的前面有黄色感叹图标,会被记录到"Warning"中.
console.error(object[, object, ...])
Firebug和Chrome控制台中,输出信息的前面有红色叉图标,会被记录到"Warning"中.
console.log("Here is log");
console.info("Here is info");
console.debug("Here is debug");
console.warn("Here is warn");
console.error("Here is error");;
Firebug
Chrome
console.assert(expression[, object, ...])
判断表达式或变量是否为真.
console.clear()
清空控制台
console.dir(object)
返回对象的全部属性和方法.
console.dirxml(object)
以 xml 的树状结构返回对象.
console.trace()
追踪函数的调用路径,返回相应位置.
console.group(object[, object, ...])
以树状结构分组显示,分组的内容全部展开显示.
console.groupCollapsed(object[, object, ...])
和 console.group() 作用一样,不过 console.groupCollapsed()分组的内容不展开显示.
console.groupEnd()
无论用 console.group() 还是 console.groupCollapsed(), 都要以 console.groupEnd() 为结束标记.
console.group("1");
console.log("1.1");
console.log("1.2");
console.log("1.3");
console.groupCollapsed("1.4");
console.log("1.4.1");
console.log("1.4.2");
console.groupEnd();
console.log("1.5");
console.groupEnd();
Chrome
console.time(name) 和 console.timeEnd(name)
计算代码运行所需时间;
console.time("times");
var n = 0;
for(var i = 0; i < 9999999; i++) {
n += 2;
};
console.timeEnd("times")
测试代码的性能;
function f(){
for(var i=0;i<999999;i++){}
}
console.profile('power');
f();
console.profileEnd();
console.count([title])
计算改行代码执行的次数
for(var i=0;i<999;i++) {
console.count("aaa");
}
console.table(data[, columns])
以表格方式显示数组
var table1 = new Array(5);
for (var i=0; i<table1.length; i++)
table1[i] = [i+1, i+2, i+3, i+4, i+5, i+6, i+7];
console.table(table1);
上面这些API都是Firebug的,
虽然Chrome的控制器也基本支持,但兼容得还不算很好.