天天看點

你應該了解的 5 個 JavaScript 調試技巧

<a target="_blank"></a>

if (somethinghappens) {

    debugger;

}

隻需記住在上線前移除。

有時dom像有了自己的想法。當不可思議的變化發生時很難找到問題的根源。 chrome開發人員工有調試這個問題的超級有用技能。這就是所謂的“break on…”,你可以通過在元素頁籤上右鍵dom節點找到它。 

斷點可以在節點被删除後設定,當節點的屬性更改或者其子樹中的節點變化時。

你應該了解的 5 個 JavaScript 調試技巧

xhr斷點或我稱作的ajax斷點,也允許當一個預期ajax請求建立時斷開。 當調試你的web應用的網絡時這是個讓人吃驚的工具。

你應該了解的 5 個 JavaScript 調試技巧

chrome增加了内置的移動裝置模拟工具,這将簡化你的日常工作。 選擇任何非console的頁籤找到它們,按鍵盤上的esc鍵并選擇你想摸你的移動裝置。 你當然不會得到一個真正的iphone,但尺寸、觸摸事件和agemt都會為你效仿。

你應該了解的 5 個 JavaScript 調試技巧
你應該了解的 5 個 JavaScript 調試技巧

還有什麼呢? 沒有這些工具我不能想象如何開發。當我發現新的後我會釋出更多,敬請期待。

原文釋出時間為:2014-03-04

本文來自雲栖社群合作夥伴“linux中國”