5 個 JavaScript 除錯技巧
導讀 | 當時做專案時搜尋了這篇文章,覺得很實用,所以轉載下來,分享給大家,便於在專案中運用 |
之前使用過用printf debugging,自此之後我用這種方法似乎總能更快地解決bug。 在某些情況下需要更好的工具,下面是其中的一些佼佼者,我敢肯定你會發現它們的有用之處:
你可以使用“debugger;”語句在程式碼中加入強制斷點。 需要斷點條件嗎?只需將它包裝它在IF子句中:
if (somethingHappens) { debugger; }
只需記住在上線前移除。
有時DOM像有了自己的想法。當不可思議的變化發生時很難找到問題的根源。 Chrome開發人員工有除錯這個問題的超級有用技能。這就是所謂的“Break on…”,你可以透過在元素選項卡上右鍵DOM節點找到它。
斷點可以在節點被刪除後設定,當節點的屬性更改或者其子樹中的節點變化時。
XHR斷點或我稱作的Ajax斷點,也允許當一個預期Ajax請求建立時斷開。 當除錯你的web應用的網路時這是個讓人吃驚的工具
Chrome增加了內建的移動裝置模擬工具,這將簡化你的日常工作。 選擇任何非Console的選項卡找到它們,按鍵盤上的esc鍵並選擇你想摸你的移動裝置。 你當然不會得到一個真正的iPhone,但尺寸、觸控事件和agemt都會為你效仿。
YSlow是個偉大的工具。Chrome也在開發人員工具下包含一個稱作Audits的類似工具。 使用快速稽核一下你的網站,來獲得有用實際的最佳化技巧。
還有什麼呢? 沒有這些工具我不能想象如何開發
原文來自:
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/69955379/viewspace-2987787/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- JavaScript 反除錯技巧JavaScript除錯
- 老司機常用的幾個JavaScript除錯技巧JavaScript除錯
- 12個Visual Studio除錯效率技巧除錯
- 推薦幾個不錯的console除錯技巧除錯
- console 除錯技巧除錯
- Chrome 除錯技巧Chrome除錯
- css除錯技巧CSS除錯
- Xcode 除錯技巧XCode除錯
- JavaScript 中 JSON 的 5 個小技巧?JavaScriptJSON
- docker 容器除錯技巧Docker除錯
- VC++除錯技巧C++除錯
- chrome的除錯技巧Chrome除錯
- 前端js除錯技巧前端JS除錯
- debug技巧之本地除錯除錯
- React Native / React除錯技巧React Native除錯
- Xcode除錯技巧之:LLDBXCode除錯LLDB
- debug技巧之使用Arthes除錯除錯
- debug技巧之遠端除錯除錯
- 很好用的 UI 除錯技巧UI除錯
- 【除錯技巧】Dialog dismiss 崩潰除錯
- 谷歌瀏覽器除錯技巧谷歌瀏覽器除錯
- K8s必須掌握的7個除錯技巧K8S除錯
- JavaScript 除錯常見報錯以及原因JavaScript除錯
- 一文讀懂H5移動開發除錯技巧H5移動開發除錯
- 前端Chrome除錯技巧最全彙總前端Chrome除錯
- 筆記|軟體除錯的技巧筆記除錯
- Android Studio程式碼除錯技巧篇Android除錯
- 【Java】Debug斷點除錯常用技巧Java斷點除錯
- Java安全之jar包除錯技巧JavaJAR除錯
- 動態除錯及LLDB技巧集合除錯LLDB
- Postman除錯技巧之介面簽名Postman除錯
- 5 個鮮為人知 GNU 偵錯程式(GDB)技巧
- 5個常見的JavaScript記憶體錯誤JavaScript記憶體
- 5分鐘掌握JavaScript小技巧JavaScript
- 【譯】編寫更好JavaScript條件語句的5個技巧JavaScript
- Java專案除錯技巧及版本控制Java除錯
- 程式碼除錯技巧【OI縮水版】除錯
- Chrome DevTools 中你可能不知道的 9 個除錯技巧Chromedev除錯