chrome console cheat sheet

快捷键

打开console界面快捷键：ctrl+shift+J

清空log：ctrl+L

 

选项

Log XMLHTTPRequests：显示ajax

Preserve log upon navigation：页面跳转时保留log

 

javascript方法

console.log：普通

console.info：=console.log

console.warn：警告

console.error：错误

console.count：输出被运行的次数，以参数分组计数

console.dir：把内容当作DOM或者javascript对象格式输出

console.dirxml：把内容输出为xml格式

console.assert：第一个参数为false时输出

console.trace：输出javascript调用栈

console.group：分组，可指定分组名

console.groupCollapsed：初始是折叠的分组开始标记

console.groupEnd：结束最近的分组，不接收参数

console.time：计时开始，传入参数为计时器名称

console.timeEnd：计时结束，必须与计时开始的计时器名称相同

console.timeStamp：在timeline视图中添加一个监控点

console.clear：清除控制台已经输出的log

debugger：在javascript设置断点

debugger;

 

占位符和输出格式

%s	字符串
%d, %i	数字
%f	浮点数
%o	DOM元素（DOM的源代码）
%O	javascript对象
%c	指定输出内容的样式，样式作为第二个参数传入   console.log("%cThis will be formatted with large, blue text", "color: blue; font-size: x-large");

 

 

 

 

 

 

 

 

 

 

 

 

 

控制台命令

clear：清除log

$()：= document.querySelector()

$$()：=document.querySelectorAll()

$x()：XPath表达式

$_ ：为最后一次通过$()，$$()或者$x()查询出来的结果

$0, $1, $2, $3 and $4：最后五次的查询结果

monitorEvents：监听事件，

monitorEvents(window, "resize");
monitorEvents(document.body, ["mousedown", "mouseup"]);
monitorEvents($('#scrollBar'), "touch"); //指定一个事件集的名字，同时监听 "touchstart", "touchend", "touchmove", 和 "touchcancel"

mouse	"mousedown", "mouseup", "click", "dblclick", "mousemove", "mouseover", "mouseout", "mousewheel"
key	"keydown", "keyup", "keypress", "textInput"
touch	"touchstart", "touchmove", "touchend", "touchcancel"
control	"resize", "scroll", "zoom", "focus", "blur", "select", "change", "submit", "reset"

 

 

 

 

 

 

unmonitorEvents：取消监听事件

getEventListeners：返回指定对象上挂载的监听器

profile：开始收集javascript CPU profile，可以指定名称，同名多次的profile，会被分在同一组下

profileEnd：结束收集javascript CPU profile

copy：拷贝对象内容到剪贴板

dir：= console.dir

dirxml：= console.dirxml

inspect：输出DOM元素或者javascript对象

keys：输出对象的key的数组

values：输出对象的value的数组