前端開發必備調試工具（Chrome的F12自帶的功能和firebug插件差不多）
一、總結
Chrome的F12自帶的功能和firebug插件差不多
二、前端開發必備調試工具
在前端開發中我們經常會要調試頁面，主要html、css調試和js調試，這里整理一些工具：
三、firefox網頁調試插件
1.firefox插件Firebug
主要用於html、css的調試和js調試；推薦指數：
從事了數年的Web開發工作，越來越覺得現在對WEB開發有了更高的要求。要寫出漂亮的HTML代碼；要編寫精致的CSS樣式表展示每個頁面模塊；要調試javascript給頁面增加一些更活潑的要素；要使用Ajax給用戶帶來更好的體驗。一個優秀的WEB開發人員需要顧及更多層面，才能交出一份同樣優秀的作業。為幫助廣大正處於Web2.0洪流中的開發人員，在這里為大家介紹一款輕巧靈活的輔助開發工具。(轉載請注明出處：WEB前端開發 http://www.css88.com/)
介紹下載請參見： http://www.css88.com/archives/130
2.firefox插件Web Developer 1.1.6(最新版本，中文版)
主要用於html、css、js的查看和編輯；推薦指數：
Firefox上開發和調試web站點的不二之選。Web developer toolbar包含了一系列工具，從cookie管理到CSS調試，從導航線到屏幕標尺，功能簡直是多得說不完。
僅次於Firebug的網頁開發設計者工具。功能眾多而且強勁。看着這令人眼花繚亂的插件設置窗口，就能一窺它的強大。推薦網頁開發者和網頁設計者使用，能夠幫助你方便的對頁面進行調整和完善;
介紹下載請參見：http://www.css88.com/archives/417
3.firefox插件JavaScript Debugger Venkman:
主要用於JavaScript調試；推薦指數：
一個基於Mozilla的瀏覽器的JavaScript調試環境，是Mozilla瀏覽器的一個擴展。Venkman基於Mozilla JavaScript調試API（js/jsd），js/jsd API 構成了 Netscape JavaScript Debugger 1.1的基礎，Netscape瀏覽器4.x系統都提供了這個調試工具。Venkman是目前比較流行的JavaScript調試工具。強烈推薦這個剛下載了一個Mozilla免費調試器 JavaScript Debugger。這個調試器的前身為Netscape的JavaScript調試器，它是Mozilla的一個附加產品。Venkman JavaScript調試器既是一個圖形，也是一個控制台調試器。下載並安裝Venkman JavaScript調試器后，就可以通過“工具|Web開發|JavaScript調試器”菜單啟動它。這個附加產品允許你查看和調試位於源文件或網頁中的JavaScript.(轉載請注明出處：http://www.css88.com)
Venkman相關下載：https://addons.mozilla.org/zh-CN/firefox/addon/216
四、ie網頁調試插件
1.SuperPreview微軟的網頁開發調試利器
主要用於html、css的調試和各個瀏覽器（目前只能針對IE6-IE8）的頁面呈現測試；推薦指數：
SuperPreview 是微軟將推出的 Expression Web 3 的一部分，主要用於頁面的調試，目前的 Expression Web SuperPreview 允許用戶對比他們的站點在 IE 6 與 IE 7, IE 8 中的外觀，而在將來的完整版中，還將支持 Firefox, Safari, Google Chrome（可能）以及更多瀏覽器;
介紹下載請參見：http://www.css88.com/archives/760
2.Internet Explorer Collection讓你同時擁有IE1-IE8
主要用於Internet Explorer 瀏覽器（IE1-IE8）各個版本的頁面呈現測試；推薦指數：
Internet Explorer Collection可以使你的計算機同時安裝IE1-IE8，不過這個工具對vista系統支持不是很好，最近還有一個發現，Internet Explorer Collection和IE8正式版似乎有沖突，IE8正式版的下拉框會不能使用，提示“阻止了什么彈出窗口…”,嘗試了幾百次無法解決，最后我卸載了Internet Explorer Collection，這個問題就再也沒出現過。(轉載請注明出處：http://www.css88.com)
介紹下載請參見：http://www.css88.com/archives/687
3.IE Developer Toolbar及IE8 開發人員工具
主要用於html、css的調試和js調試；推薦指數：
雖然這玩意改了時髦的名字，但是卻也不是什么新玩意，它的前身是“IEdevtoolbar”。但是，以前只是IE的一個插件而已。而在IE8中，瀏覽器已經自動集成了這玩意，不僅改了個有點土鱉的名字，而且功能也加強了很多。開發人員工具在IE8的工具菜單下，或者直接點擊F12快捷鍵也可以呼叫出來。(轉載請注明出處：http://www.css88.com)
微軟的英特網探索者開發工具條是IE上最好的DOM檢查和CSS調試工具。由於IE具有高市場占有率而又在整個渲染模型上充滿缺陷（比如臭名昭著的hasLayout邊距重疊BUG），調試IE是web開發必不可少的步驟——沒有這個工具條，IE的調試將會成為一場噩夢。雖然IE Developer Toolbar要比Firebug稍微弱智一點，不過他至少能幫你馴服IE這頭怪獸。(轉載請注明出處：http://www.css88.com)
介紹下載請參見：http://www.css88.com/archives/1005和http://www.css88.com/archives/1008
4.IE下的調試工具IE WebDeveloper
主要用於html、css的調試和js調試；推薦指數：
IE WebDeveloper可以讓你檢查和編輯你的HTML DOM, 顯示錯誤信息, 日志信息, 顯示網站源代碼, 監視DHTML事件和HTTP流量. 如果你是一個開發人員或設計人員, 但平常又喜歡使用IE, 那IE webdeveloper是個不錯的選擇.它的功能可以和火狐下的Firebug相媲美，甚至有些功能還強於Firebug。
IE WebDeveloper允許直接地在瀏覽器窗口中瀏覽、傳輸和更新HTML DOM。該軟件可以實時分析網頁並且顯示為一種允許你察看表格風格、Javascript腳本，表格以及其它網頁元素的樹形風格。該軟件還可以在瀏覽器中交互式地突出顯示被選擇的網頁元素，因此你可以在實際網頁中定位其代碼。 查看style元素，定位div等等。且支持一鍵w3c檢查（包括HTML/XHTML/CSS/Javascript tutorial等）。雖然用起來不如Firebug那么得心應手，但是畢竟解決了我們在ie上調試工具不足的問題。(轉載請注明出處：http://www.css88.com)
介紹下載請參見：http://www.css88.com/archives/967
5.IETester-同時擁有IE6、IE7、IE8（Vista兼容）
主要用於Internet Explorer 瀏覽器各個版本的頁面呈現測試；推薦指數：
雖然以前我寫過IE6、IE7、IE8共存的解決方案，但是看到IETester這個軟件以后那些都已經沒有意義了（那些辦法副作用比較大，而且實現起來有些難度）。使用IETester能夠較好的解決，測試網頁兼容性的多IE版本的需求。暫時已經支持IE5.5——IE8beta1，我想這已經足夠了。還在苦苦找尋IE6和IE7共存或者IE7和IE8共存的朋友，可以試試這個軟件。當然這個軟件也不是萬能的，在最后，官方非常厚道的給出了暫時存在的重要bug列表。(轉載請注明出處：http://www.css88.com)
介紹下載請參見：http://www.css88.com/archives/345和http://www.css88.com/archives/564
6.前端調試利器DebugBar
主要用於html、css的調試和js調試；推薦指數：
前端調試工具有很多，比如FireFox firebug, FireFox Web Developer, DOM Inspector,遨游的PageView，IE WebDeveloper V2，還有IE8自帶的開發工具 等等，這里我再推薦一個DebugBar；
大家肯定都知道ieTester(點擊查看ieTester相關信息),大家都用ieTester來測試各個IE版本的頁面兼容性，其實新版的ieTester(點擊下載目前最新版的ieTester v0.3.2 ）還有一個很強大的頁面調試插件：DebugBar。(轉載請注明出處：http://www.css88.com)
介紹下載請參見：http://www.css88.com/archives/785
主要用於js調試；推薦指數：
面對一大段的JavaScript腳本，以前總是會很頭疼，找不到調試這些代碼的方法。如果出現什么錯誤或異常，總是要從頭分析，然后插入很多Alert()，調試起來很麻煩。
Visual Studio 2008中JavaScript所具有的另外一個特性，是它提供了更加強大的JavaScript調試功能，這使得JavaScript的使用及構建AJAX應用都變得容易很多。同樣，這項功能在免費的Visual Web Developer Express版本中和Visual Studio中都具有。(轉載請注明出處：http://www.css88.com)
介紹下載請參見：http://www.css88.com/archives/982
五、其他調試工具
1.用Aptana調試JavaScript教程
主要用於js的調試和各個瀏覽器；推薦指數：
2.Opera Developer Tools
Opera下的DOM,CSS查看工具,類似FireBug.
http://dev.opera.com/articles/view/opera-developer-tools/
3.webkit
Safari下的開發調試工具
http://nightly.webkit.org/