Element
作爲表層html節點，一般用來定位元素節點的樣式以及dom對象
$0
選中元素後，在console中輸入$0可以直接獲取當前的dom對象 
其中還有 $$表示上一個選中的節點，其餘就自己探索吧～
dom生成斷點
dom元素變化時可以加入斷點，包括子節點修改、屬性修改和節點移除 
查看OR添加CSS僞類
添加自定義class
Console
控制檯，百度的控制檯上還有招聘信息，調試打印日誌console.log(xx)都是在Console視窗體現。也可以把想要調試的對象掛載到window對象上，在console慢慢耍。 
其中default levels可以選擇展示console各個級別的日誌顯示
Store as global variable
Console會自動顯示返回值，如果要使用它，可以右鍵選中Store as global variable,就會把這個數據賦值給temp1,如果temp1已經使用過，則遞推temp2等等。
copy命令
打印出來的數據，不好選中直接複製，可以用copy命令進行復制到剪切版。比如
copy(temp1)
network
查看頁面發出的請求和返回值，以及每個請求的耗時
filter類型多選
windows中按住ctrl並且點擊不同類型，即可實現多選。一般看xhr和document。輸入框則是匹配接口名稱。可以輸入-，這時會提示指定的屬性選項，比如 -method:POST 
HXR and Fetch
右鍵可以選擇重新用當前的函數再次發送此處請求，一般用來調試接口~ 
WS websocket信息監聽
Preserve log
勾選該選項，則network會保存上個頁面殘留的信息
Online下拉框
可以選擇網速，Online、fast 3G、slow 3G、offline，用來模擬網頁在各個網絡環境下的表現。 
Sources
源代碼，可以打斷點，進行調試，和其餘編輯器一樣的直接左側點擊即可 
可以將變量加入watch欄，查看變量的變化和詳情。並且可以將這個變量放入console中進行調試
debugger
js代碼中放入debugger可以在開啓開發者工具（F12）時，進入斷點
Snippets
經常需要在Console中執行的腳本，比如監聽postMessage發送的消息，可以在Snippets中新建代碼片段，要用時只需要右鍵run即可。 
做併發測試時，就可以使用這個腳本，輪詢往表單裏填值，並且觸發按鈕的點擊事件，你的網頁就是我的網頁～
監聽頁面上的事件
比如監聽keydown事件，按下按鍵，則會進入斷點
Application
瀏覽器緩存
localstorage
強緩存
sessionStorage
標籤頁級別的緩存
cookie
cookie的生成
前端js生成 後端response header中帶上set-cookie,可以放在一個屬性中，也可以帶多個set-cookie 請求何時帶cookie
cookie的作用
session(服務器範疇)
存在服務器中，cookie中的sessionId 來換取session身份標識
indexDB
瀏覽器數據庫，爲了解決瀏覽器緩存大小的限制應運而生。支持條件查詢及索引 IndexedDB 具有以下特點。
- 鍵值對儲存。 IndexedDB 內部採用對象倉庫（object store）存放數據。所有類型的數據都可以直接存入，包括 JavaScript 對象。對象倉庫中，數據以"鍵值對"的形式保存，每一個數據記錄都有對應的主鍵，主鍵是獨一無二的，不能有重複，否則會拋出一個錯誤。
- 異步。 IndexedDB 操作時不會鎖死瀏覽器，用戶依然可以進行其他操作，這與 LocalStorage 形成對比，後者的操作是同步的。異步設計是爲了防止大量數據的讀寫，拖慢網頁的表現。
- 支持事務。 IndexedDB 支持事務（transaction），這意味着一系列操作步驟之中，只要有一步失敗，整個事務就都取消，數據庫回滾到事務發生之前的狀態，不存在只改寫一部分數據的情況。
- 同源限制 IndexedDB 受到同源限制，每一個數據庫對應創建它的域名。網頁只能訪問自身域名下的數據庫，而不能訪問跨域的數據庫。
- 儲存空間大 IndexedDB 的儲存空間比 LocalStorage 大得多，一般來說不少於 250MB，甚至沒有上限。
- 支持二進制儲存。 IndexedDB 不僅可以儲存字符串，還可以儲存二進制數據（ArrayBuffer 對象和 Blob 對象）。
web sql
Web SQL 數據庫 API 並不是 HTML5 規範的一部分，但是它是一個獨立的規範，引入了一組使用 SQL 操作客戶端數據庫的 APIs。如果你是一個 Web 後端程序員，應該很容易理解 SQL 的操作。
- openDatabase：這個方法使用現有的數據庫或者新建的數據庫創建一個數據庫對象。
- transaction：這個方法讓我們能夠控制一個事務，以及基於這種情況執行提交或者回滾。
- executeSql：這個方法用於執行實際的 SQL 查詢。 IndexedDB更像是一個NoSQL數據庫，而WebSQL更像是關係型數據庫，使用SQL查詢數據。W3C已經不再支持這種技術
Performance
錄製網頁行爲
一般是分析前端網頁卡死或者棧溢出，沒有及時GC，用此工具進行分析 
點擊錄製後，進行你認爲卡的操作，然後stop，可以看頁面渲染快照並且當時的js heap，監聽器行爲，一般是同步，如果heap到頂部沒下落，說明沒有正常GC，一般分析爲bus消息總線監聽後沒有在destroyed中銷燬。 
Memory
- Collect Javascript CPU Profile：JS函數對CPU的消耗
- Take Heap Snapshot：用於分析JS對象及其關聯的DOM節點的內存分佈。
- Record Heap Allocations：記錄內存分配信息，用於分析內存泄露的情況。
參考runoob 以及 阮一峯老師博客