DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> 靈活應用js調試技巧解決樣式問題的步驟分享
靈活應用js調試技巧解決樣式問題的步驟分享
編輯:關於JavaScript     
由於種種原因,例如:代碼邏輯復雜、時間久了遺忘處理細節、或者根本就是接手修改別人遺留的bug,在這種情況下,debug就會變成一件頭疼的事情。

在此分享一些JS調試方面的技巧,針對各種疑難雜症,往往能起到較好的效果。

Step 1:檢查服務器直接render出來的內容

    使用查看源文件的方式,這一步首先明確,頁面HTML片段是否在服務器端就已經不正常了。

Step 2:比較實際的HTML內容和服務器render出來的原始內容之間的差異

    可以使用一些前端工具(例如:IE下的開發人員工具、Firebug、Chrome的開發人員工具等),實時查看當前HTML片段內容

Step 3:在合適的位置增加debugger

    例如:先找出大概可能出問題的js代碼,在合適的地方加debugger,或者是使用工具增加類似於“在屬性被修改時中斷”的斷點,例如實際的HTML比原始內容多出了一個width屬性

Step 4:運行你的頁面,進入中斷,並檢查js調用堆棧(關鍵的一步)

    推薦使用IE支持的Visual Studio調試器(需要先設置IE:取消“禁用腳本調試”),這時基本就能確定是哪個js方法修改了樣式
XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved