檢視開發者工具的原始碼

'''Web 開發工具'''（通常稱做'''devtools'''）是一種網頁開發者測試佮調試代碼的工具。無仝款佇網站創建器抑是集做開發環境，Web 開發工具無直接參與網站的創建，用佇咧測試網站抑是網頁應用的用戶界面。

Web 開發工具一般內置佇咧網頁瀏覽器抑是作為瀏覽器的附加組件使用。大多數市面上定定看著的網頁瀏覽器，如 Google Chrome、Firefox、Internet Explorer、Safari、Microsoft Edge 和 Opera，攏有內置的工具用佇網站開發，佇其各自的插件中心會當下載著閣較濟工具。

Web 開發工具方便開發人員調試各種瀏覽器網頁處理技術，比如講 HTML、CSS、DOM、JavaScript。隨著對瀏覽器的功能需求愈來愈懸，流行的瀏覽器已經包含閣較濟面向開發者的特性。

==瀏覽器支持概覽==

一寡知名的瀏覽器攏支持 Web 開發工具，予網頁設計師佮開發者會當查看頁面的構成。所有這種工具攏有囥佇咧瀏覽器，無需要額外的模塊抑是配置。

* Firefox 瀏覽器–` F 十二 ` 拍開網頁控制台 / 瀏覽器控制台 ( 自 Firefox 四以後 )。網頁控制台作用佇孤一个頁面；瀏覽器控制台做伙瀏覽器。
* Google Chrome
* Internet Explorer 和 Microsoft Edge
* Opera
* Safari

==常用特性==

使用 Web 開發工具的通常做法是，滑鼠懸停佇咧頁面的元素頂懸，然後佇正菜單中選擇「檢查的元素」抑是按呢相仝選項。閣較捷看的替代方式是使用快捷鍵 ` F 十二 `。

===HTML 和 DOM===

Web 開發工具通常包含了 HTML 佮 DOM 屬性查看器。這佮瀏覽器「查看原始碼」功能的無仝的所在佇咧，HTML 佮 DOM 屬性查看器毋但允准你查看頁面 DOM 屬性當前的渲染結果，猶閣允准你查看改動了屬性值了後頁面即時更新的渲染結果。

除了選擇佮編輯以外，HTML 元素面枋通常閣會顯示 DOM 對象的屬性，比如講 CSS 樣式屬性。

==擴展佮插件==

現代瀏覽器支持使用插件抑是擴展來添加抑是增強功能。真濟捷用的插件實現矣 Web 開發工具無的功能，譬如講禁用 JavaScript，禁用 CSS 等咧。

==參考文獻==

[[分類: 待校正]]