你不知道的chrome控制檯指令
通常，我們在chrome控制檯中用的最多的是$0，$0是顯示當前選擇的元素，現在來看看還有其他的你不知道的chrome控制檯指令。
$_
$_
返回的是上一次表示式的值
如圖，先執行
2+2
，返回4這個值，再執行
$_
顯示上次的4這個值
再看一個例子，初始值是一個數組，那麼第一次的
$_
返回的值是這個陣列，執行以下
$_。length
返回陣列的長度4，再執行
$_
就變成4了。
$0 - $4
$0
$1
$2
$3
$4
返回的是最近N次的選擇的元素。
最常用的就是$0，返回當前選中的元素
如圖，先選中一個元素，
$0
返回當前這個元素，再選中其他元素，當前
$0
返回的是新元素，此時
$1
返回的是上一個元素。
$（selector， ［startNode］）
其中
startNode
都是起始父元素
$（selector）
返回的是css選擇器查詢到的元素的引用，
document。querySelector
函式的縮寫。
如圖，返回的是頁面中第一個img元素。
右鍵選中返回的元素還能選擇
Reveal in Elements Panel
，直接跳到Elemtents的面板中元素的位置。
$$（selector， ［startNode］）
$（selector） 返回的是css選擇器查詢到的元素的引用，是 document。querySelector All 函式的縮寫。
$x（path， ［startNode］）
$x（path）
能使用xpath選擇器來返回符合選擇器的所有元素
clear（）
clear（）
用於清除歷史記錄。
copy（object）
copy
可以直接複製字串表示式。
debug（function）
當指定函式被執行時自動觸發source panel的debug功能。
同樣可以
undebug（fn）
取消debug on
dir（object）
dir（object）
列出指定object的所有屬性，相當於
console。dir（object）
dirxml（object）
dirxml
返回指定物件的xml結構，相當於
console。dirxml（）
inspect（object/function）
如果是物件，則會跳轉到element panel下指定的元素，如果是function則會跳到source 面板對應函式的位置。
下面是引數是document。body的例子
inspect（document。body）；
getEventListeners（object）
返回指定元素所有繫結的事件，其中各類事件都會相對應聚合成對應的陣列，比如click，keydown之類。
如圖，是繫結在document上所有事件
getEventListeners（document）；
keys（object）
返回指定物件的所有key的陣列，相當於Object。keys
當然還有對應的values，也相當於Object。values
var
player1
=
{
“name”
：
“Ted”
，
“level”
：
42
}
monitor（function）
當指定一個函式時，會監聽這個函式呼叫，返回當下這個函式呼叫時的引數。
也可以用unmonitor（function）解除監聽
monitorEvents（object［， events］）
當在一個指定元素上指定監聽事件的時候，事件觸發就會列印在控制檯上，可以傳單個事件、一堆事件陣列，或者一系列事件。
如圖，監聽window的resize事件
monitorEvents（window， “resize”）；
下面是監聽一組事件
monitorEvents（window， ［“resize”， “scroll”］）
如圖所示，你可以指定一種事件型別來匹配預先定義好的事件集合。
如下，監聽所有key的事件集合，當所有鍵盤事件觸發的時候都會打印出來。
monitorEvents（$0， “key”）；
profile（［name］） 和 profileEnd（［name］）
profile（）
來啟動一個自定名字的cpu統計，
profileEnd（）
來結束這次統計，並在Profile面板顯示結果。
這個面板內容可以參考：
https：//
developers。google。com/w
eb/tools/chrome-devtools/rendering-tools/js-execution
開始一次統計
profile（“My profile”）
在Profile面板中的結果
table（data［， columns］）
打印出格式化的表格，可以定製表頭，比如打印出顯示名字做成的表格：
var
names
=
{
0
：
{
firstName
：
“John”
，
lastName
：
“Smith”
}，
1
：
{
firstName
：
“Jane”
，
lastName
：
“Doe”
}
}；
table
（
names
）；
是console。table的簡寫。
其他
如果頁面中有元素使用了id，那可以直接使用這個id作為控制檯裡的變數
多彩的輸出
console。log（‘%cred’， ‘color：red’）；
參考文件：