摘自：http://www.tkk7.com/Unmi/archive/2009/09/26/296555.html
作者：Klaus Komenda ， 翻譯：butwho
英文原文：Collection of Web Developer Tools, per Browser
原文發現：譯言-Collection of Web Developer Tools for major browsers
中文譯文：Web開發工具大集合——每個瀏覽器都有份的！
網
站開發者的一大苦惱，就是有太多的瀏覽器要應付。幸虧世界上有一些聰明的人，能夠研究出一大些方便編輯和調試網頁代碼的好工具。不過，要從不計其數的小工
具里面找出合適的可真不容易。這篇文章列出了幾個最好用的web開發工具，并指導你快速地激活、安裝、使用他們。 下面是工具列表：
| 瀏覽器 |
可用的工具 (括號中是應用范圍) |
| Firefox |
|
| IE6, IE7 |
|
| Opera |
|
| Safari |
|
Web Developer Toolbar
Firefox上開發和調試web站點的不二之選。Web developer toolbar包含了一系列工具，從cookie管理到CSS調試，從導航線到屏幕標尺，功能簡直是多得說不完。 Web開發工具欄 下載地址：http://chrispederick.com/work/web-developer/
Firebug
螢火蟲 是Firefox上數一數二的好擴展，可作為web developer toolbar的補充工具。你可以用Firebug在線檢查、監控、編輯網頁上的HTML、CSS、JavaScript代碼。他還提供一個腳本控制臺，讓JS編輯編的更簡單?？刂婆_對象包含了一大堆選項，允許你輸出代碼到控制臺然后進行調試。Michael Sync提供一個更高級的操作指南，它可以知道你詳盡地設置Firebug的選項。另外，Firebug上有一個帶寬監視器，能讓你清楚地看到某些代碼占了多少帶寬。 Firebug 下載地址：http://www.getfirebug.com/
Modify headers是一個可以添加、修改和過濾HTTP請求頭的工具。你可以用這個工具冒充成移動設備登陸網站，它甚至可以偽造一個Ajax請求。 Modify Headers 下載地址：http://modifyheaders.mozdev.org/
Poster
你可以通過Poster擴展與Web服務或者其他web資源進行交互，它能讓你發送HTTP請求、設置請求實體和內容格式。這可以讓你檢測Web交互的效果。 Poster下載地址：http://code.google.com/p/poster-extension/
XRAY & MRI
X光和核磁共振成像是可以應用在IE6+、Webkit和Mozilla為基礎的瀏覽器上的bookmarklets（嘛叫Bookmarklets），包括Safari, Firefox, Camino和Mozilla. Xray 能幫你檢測盒模型里的每一個元素，MRI可以測試和應用選擇器。 XRay下載地址：http://www.westciv.com/xray/index.html MRI下載地址：http://www.westciv.com/mri/
Firefox Accessibility Extension
Mozilla/Firefox無障礙擴展讓殘疾人士方便地瀏覽網頁內容。開發人員可以用這個擴展檢查他們的結構和樣式的網頁易讀性。 Firefox Accessibility Extension下載地址：http://firefox.cita.uiuc.edu/
IE Developer Toolbar
微軟的英特網探索者開發工具條是IE上最好的DOM檢查和CSS調試工具。由于IE具有高市場占有率而又在整個渲染模型上充滿缺陷（比如臭名昭著的hasLayout邊距重疊BUG），調試IE是web開發必不可少的步驟——沒有這個工具條，IE的調試將會成為一場噩夢。雖然IE Developer Toolbar要比Firebug稍微弱智一點，不過他至少能幫你馴服IE這頭怪獸。 IE Developer Toolbar下載地址：http://www.microsoft.com/downlo…aylang=en
Web Accessibility Toolbar
The Web Accessibility Toolbar（
>Opera版）可
以檢查網站的易讀性（當然是可能的易讀性，總不能指望電腦能像人一樣讀網頁吧？）此外，這個工具還提供其他功能，比如檢查死鏈接和改變瀏覽框大小等等。
The Web Accessibility Toolbar下載地址:http://www.visionaustralia.org.au/ais/toolbar/
Visual Web Developer Express Edition
IE開發工具欄木有JavaScript調試功能，你得找個別的工具搞JS。你可以用Microsoft Script Debugger（下面將提到）或者免費下載這個重量級的Visual Web Developer Express Edition。Bernie那兒有這個工具的教程（當
然是英文的），它詳盡地告訴你如何用這個工具調試JavaScript代碼。 你也可以用Microsoft Script Editor 編輯
JS代碼——不幸的是，這并不是個免費工具（在國內，這似乎不是個大問題）。他被捆綁在Office
2003安裝包里，而微軟又不提供單獨下載。正因為如此，這兒就不多提它了。Jonathan Boutelle提供了這個工具的一些教程。
Microsoft Script Debugger
你可以在微軟網站上免費下載這個工具，MSDN上也有一個相關文檔。這個工具比Visual Web Developer Express Edition弱很多，不過仍然能處理一些IE上那些讓人摸不著頭腦的提示，諸如“缺乏對象”一類。Jake Howlett 有個《如何使用Microsoft Script Debugger調試JavaScript》的教程。為安全起見，安裝腳本調試器之后最好要重新啟動一下你的電腦。 Microsoft Script Debugger下載地址：http://www.microsoft.com/do..laylang=en
Opera有兩個開發工具：Opera 開發控制臺(Opera Developer Console)和Dom快照工具(DOM Snapshot)。從截圖來看，他們都很有前途。這個工具算是Opera 9以上版本用的bookmarklets。不過我沒能讓他們在Opera 9.10上成功運作。 Opera開發工具下載地址：http://dev.opera.com/tools/
Opera Error Console
錯誤控制臺是Opera的一個內置功能，可以在工具-高級-錯誤控制臺中激活這個它。它能彈窗顯示當前網頁上的錯誤或者警告信息，或者你可以過濾某種類型的信息，比如HTML、CSS、XML或者Javascript警告。你可以在opera網站找到錯誤控制臺的詳細教程。
Safari Debug Menu
Safari的debug能力很弱，但至少顯示一個Javascript控制臺能讓Javascript調試變得簡單點兒（這與Firebug和Opera錯誤控制臺類似）。在Apple網站的開發部門，有一個常見問題文檔說明如何啟用隱藏的調試菜單。 在Mac OS X下，打開一個終端然后輸入：
defaults write com.apple.Safari IncludeDebugMenu 1
在
windows下，用文本編輯器打開Preferences.plist，這個文件的位置往往是C:Documents and
SettingsUSERNAMEApplication DataApple
ComputerSafariPreferences.plist，在文件最后添加： <key>IncludeDebugMenu</key> <true/> 在Safari 1.3及以上版本，你可以進入Debug菜單然后鉤選“記錄Javascript意外”的選項。然后選擇“顯示JavaScript Console”。這就可以用控制臺記錄Javascript錯誤。
Web Inspector
要在Mac OS上激活Safari Web Inspector (Safari 3及以上可用)，打開終端窗口然后輸入
defaults write com.apple.Safari WebKitDeveloperExtras -bool true
在windows中，打開Documents and Settings*你的用戶名*Application DataApple ComputerSafariWebKitPreferences.plist，添加以下內容：
<key>WebKitDeveloperExtras</key>
<true/>
然后退出Safari并重新打開，你將在菜單中看到一個“檢查元素”選項，就是它了！
**知識擴充：嘛叫bookmarklets?
具體說來，俺也不大清楚，新名詞??？在這兒找到一個解釋：
所
謂的Bookmarklet，簡單的說，就是一個內含簡單
JavaScript程式碼的書籤。使用的方法和書籤一樣，不同的地方是：書籤是用來記錄瀏覽的位置，而bookmarklet則是記錄某些程序或是方
法。
另一方面，bookmarklet在本質上可說是將JavaScript語言類比為一通訊協定(protocol)，就像http或是ftp一樣，並需要
透過瀏覽器來進行解譯，因此，bookmarklet必需依靠瀏覽器才能發揮功用。
好像說，Greasemonkey之類的玩意兒就跟bookmarklet相關？
原文：http://www.weborn.org/collection-of-web-developer-tools-per-browser-466/