1、控制台中好用的操作：
（1）$_ 表示上一次執行的結果，$0 - $4則代表了最近5個選擇過的DOM節點。
在審查元素時點擊DOM結點樹的節點后，這些被點擊過的節點會被記錄下來，$0會返回最近一次點選的DOM結點，以此類推，$1返回的是上上次點選的DOM節點，最多保存了5個，如果不夠5個，則返回undefined。
$ 理解為 document.querySelector
$$ 理解為 document.querySelectorAll
（2）Chrome 控制台中原生支持類jQuery的選擇器，即我們可以用$加上熟悉的css選擇器來選擇DOM節點。
如： $('#cont')
（3）copy()
通過此命令可以將在控制台獲取到的內容復制到剪貼板。
如copy(document.body) 就可以將body中的HTML復制到sublime中。
（4）keys和values
前者返回傳入對象所有屬性名組成的數據，后者返回所有屬性值組成的數組。
var obj = {
name: 'shiddong',
country: 'China',
city: 'shanghai'
};
keys(obj); // ['name', 'country', 'city']
values(obj); // ['shiddong', 'China', 'shanghai']
2、html中綁定函數的js源碼定位
大家在本頁面看到頁面右下方有一個推薦的圖標嗎？右擊推薦圖標，選擇審查元素，打開谷歌控制台，如下圖所示
現在就可以知道votePost方法到底在哪，在Console面板里面輸入votePost然后回車
直接點擊上圖中的代碼，控制台將定位到Sources面板中
點擊中間面板左下方的Pretty print / {}
3、jQuery綁定事件的js源碼定位
這次我們來看“提交評論”作說明，右擊“提交評論”-->審核元素，我們可以清楚的看到在這個按鈕上未綁定任何事件。在Console面板內輸入如下代碼
function lookEvents (elem) {
return $.data ? $.data( elem, "events", undefined, true ) : $._data( elem, "events" );
}
var event = lookEvents($("#btn_comment_submit")[0]); // 獲取綁定的事件
event.click[0].handler
如下圖所示：
按照上述介紹的方法定位到具體的blog-common.js里面，找到postComment 然后一層層的找到具體的代碼，再設置斷點就好了。
4、代碼調試
調試第一步便是設置斷點，其實設置斷點很簡單，點擊一下上圖所示的92即可，這時你會發現92行號旁邊會多了一個圖標。
因為91行是函數的定義處，所以沒法在此設置斷點。
設置好了斷點后，就會在右邊Breakpoints方框里看到剛剛設置的斷點。
調試快捷鍵
| 快捷鍵 | 功能 |
|---|---|
| F8 | 恢復運行 |
| F10 | 步過，遇到自定義函數也當成一個語句執行，而不會進入函數內部 |
| F11 | 步入，遇到自定義函數就跟入到函數內部 |
| Shift + F11 | 步出，跳出當前自定義函數 |
（事實上我們也可以不用下表所示的快捷鍵，直接點擊上圖所示右側欄最上層的一排按鈕來進行調試，具體用哪個按鈕，把鼠標放到按鈕上方一會就會顯示它相應的提示）
從左到右，以此對應上面的列表中的快捷鍵。
其中值得一提的是，當我們點擊“推薦”按鈕進行調試的時候會發現，不管我們是按的F10進行調試還是按F11進行逐步調試，都沒法進行$.ajax函數內部，即使我們在函數內部設置了斷點也沒有辦法進入，這里按F8才是真正起效果的。
當我們在調試的時候，右側Scope Variables里面會顯示當前作用域以及他的父級作用域，以及閉包。你不僅能在右側 Scope Variables(變量作用域) 一欄處看到當前變量，而且還能把鼠標直接移到任意變量上，就可以查看該變量的值。
另外還有一個神器，debugger;
如果自己寫的代碼，執行的時候想讓它在某一處停下來，只要在代碼中寫上的debugger就好了。
debugger;
Refer:
Chrome console : http://www.cnblogs.com/liyunhua/p/4529079.html
Chrome 控制台console的用法 : http://www.open-open.com/lib/view/open1421131601390.html