1. debugger;

正如我之前提到的，你可以使用“調(diào)試器”;用于向代碼添加強(qiáng)制斷點(diǎn)的語(yǔ)句。需要斷點(diǎn)條件？只需將其包裝在IF子句中：

請(qǐng)記住在上線之前刪除它。

2. 當(dāng)節(jié)點(diǎn)變化時(shí)斷開(kāi)

有時(shí)DOM似乎有自己的想法。當(dāng)發(fā)生令人難以置信的變化時(shí)，很難找到問(wèn)題的根本原因。 Chrome開(kāi)發(fā)人員員具有調(diào)試此問(wèn)題的超級(jí)實(shí)用技能。這稱(chēng)為“Break on .”，您可以通過(guò)右鍵單擊Elements選項(xiàng)卡上的DOM節(jié)點(diǎn)找到它。

刪除節(jié)點(diǎn)后，節(jié)點(diǎn)的屬性更改或其子樹(shù)中的節(jié)點(diǎn)更改時(shí)，可以設(shè)置斷點(diǎn)。

3. Ajax斷點(diǎn)

XHR斷點(diǎn)或我稱(chēng)之為Ajax斷點(diǎn)的東西也允許在創(chuàng)建預(yù)期的Ajax請(qǐng)求時(shí)斷開(kāi)連接。在調(diào)試Web應(yīng)用程序的Web時(shí)，這是一個(gè)了不起的工具。

4. 模擬不同的移動(dòng)設(shè)備

Chrome增加了內(nèi)置的移動(dòng)設(shè)備模擬工具，可以簡(jiǎn)化您的日常工作。選擇任何非控制臺(tái)選項(xiàng)卡以查找它們，按鍵盤(pán)上的esc鍵并選擇要觸摸的移動(dòng)設(shè)備。

當(dāng)然，你不會(huì)得到真正的iPhone，但尺寸，觸摸事件和agemt將適合你。

5. 通過(guò)審核提升你的站點(diǎn)

YSlow是一個(gè)很棒的工具。 Chrome還在開(kāi)發(fā)者工具下包含一個(gè)名為Audits的類(lèi)似工具。快速查看您的網(wǎng)站，以獲得有用的實(shí)際優(yōu)化提示。