Microsoft Edge DevTools 檔

使用 Microsoft Edge DevTools 進行開發。

開始使用 DevTools

開始使用

• DevTools 概觀
• 將 DevTools 放置 (Undock、Dock 變更為底部、將 Dock 變更為左)
• 在命令功能表中執行命令
• 主控台概觀

最新消息

• Microsoft Edge DevTools 的新功能
• 請連絡 Microsoft Edge DevTools 小組

自訂 DevTools

開始使用

• 自訂 DevTools
• 將色彩主題套用至 DevTools

最新消息

• Microsoft Edge DevTools 中的實驗性功能

操作指南

• 變更 DevTools 語言設定
• 自訂鍵盤快速鍵

偵錯 Web 專案

快速入門

• 使用檢查工具分析頁面

教學課程

• 開始檢視和變更 CSS
• 開始檢視和變更 DOM

操作指南

• 使用問題工具尋找並修正問題
• 使用 3D 檢視工具流覽網頁層、z-index 和 DOM
• 檢查動畫
• 偵錯漸進式Web Apps (PWA)
• 檢查網路活動

模擬和測試

操作指南

• 模擬裝置模擬 (裝置模擬)
• 輔助功能測試功能
• 在轉譯的頁面中模擬深色或淺色配置
• 使用來源順序檢視器測試鍵盤支援
• 強制預覽列印模式
• 模擬視覺缺陷
• 模擬縮減動作

JavaScript 和效能

操作指南

• 在主控台中執行 JavaScript
• 修正主控台中回報的 JavaScript 錯誤
• 來源工具概觀
• JavaScript 偵錯功能
• 使用涵蓋範圍工具尋找未使用的 JavaScript 和 CSS 程式碼
• 修正記憶體問題
• 使用 Detached Elements 工具偵錯 DOM 記憶體流失
• 使用安全性工具瞭解安全性問題
• 針對常見的效能問題進行疑難排解

參考

參考

• 快速鍵
• CSS 功能參考
• 主控台功能參考
• 主控台物件 API 參考

操作指南

• 效能功能參考

sample

• DevTools 的範例程式碼