原文：https://developers.google.com/web/updates/2017/08/devtools-release-notes#await
1. 截圖
以前截取網(wǎng)頁我都用qq，直接ctrl+alt+a?，F(xiàn)在chrome自帶了截圖功能，可以截取指定區(qū)域或者指定dom元素。
screenshot.png
截取指定區(qū)域：按ctrl+shift+c, 然后按住鼠標(biāo)左鍵不放，選取網(wǎng)頁區(qū)域，最后松手會(huì)下載截圖的圖片。
截取指定dom元素：右鍵檢查元素，按ctrl+shift+P打開命令面板。輸入"capture node"。然后回車，就會(huì)下載內(nèi)容為指定元素的圖片。
2. 新api
在console中，可以直接使用queryObjects查詢特定的constructor
- queryObjects(Promise). 返回所有的 Promises.
- queryObjects(HTMLElement). 返回所有的 HTML elements.
- queryObjects(foo), foo是函數(shù)名。返回所有實(shí)例化new foo()后的對(duì)象。
console
大部分人經(jīng)常用 console.log()
使用 keys(console) 打印所有方法，keys 和 values 類似 Object.keys，Object.values 只在調(diào)試面板有用。
image.png
各個(gè)方法的詳細(xì)用法請(qǐng)查看 https://developers.google.com/web/tools/chrome-devtools/console/utilities
$
看到$大家不要以為是jquery，其實(shí)是瀏覽器自帶的一些api。這個(gè)在調(diào)試上就比較方便！
$:返回第一個(gè)符合條件的元素，相當(dāng)于document.querySelector
$$:返回所有符合條件的元素，相當(dāng)于document.querySelectorAll
查找和監(jiān)控事件
getEventListeners作用就是查找并獲取選定元素的事件。用法如下
monitorEvents作用是監(jiān)控你所選元素關(guān)聯(lián)的所有事件，事件觸發(fā)時(shí)，在控制臺(tái)打印它們。
getEventListeners和monitorEvents感覺在開發(fā)上用得并不多了，至少我沒用過。但是感覺會(huì)有用，就提及一下
類似可以使用 monitor 來監(jiān)控函數(shù)，每次調(diào)用該函數(shù)，就會(huì)打印出傳入的參數(shù)。
var func1 = function(x, y, z) {
//....
};
輸出：
image.png
參考：
