摘自：http://www.cnblogs.com/charliechu/p/5948448.html

• Elements:查找網(wǎng)頁源代碼HTML中的任一元素,手動修改任一元素的屬性和樣式且能實時在瀏覽器里面得到反饋。
• Console:記錄開發(fā)者開發(fā)過程中的日志信息，且可以作為與JS進行交互的命令行Shell。
• Sources:斷點調(diào)試JS。
• Network:從發(fā)起網(wǎng)頁頁面請求Request后分析HTTP請求后得到的各個請求資源信息（包括狀態(tài)、資源類型、大小、所用時間等），可以根據(jù)這個進行網(wǎng)絡(luò)性能優(yōu)化。
• Timeline:記錄并分析在網(wǎng)站的生命周期內(nèi)所發(fā)生的各類事件，以此可以提高網(wǎng)頁的運行時間的性能。
• Profiles:如果你需要Timeline所能提供的更多信息時，可以嘗試一下Profiles,比如記錄JS
  CPU執(zhí)行時間細(xì)節(jié)、顯示JS對象和相關(guān)的DOM節(jié)點的內(nèi)存消耗、記錄內(nèi)存的分配細(xì)節(jié)。
• Application:記錄網(wǎng)站加載的所有資源信息，包括存儲數(shù)據(jù)（Local Storage、Session
  Storage、IndexedDB、Web SQL、Cookies）、緩存數(shù)據(jù)、字體、圖片、腳本、樣式表等。
• Security:判斷當(dāng)前網(wǎng)頁是否安全。
• Audits:對當(dāng)前網(wǎng)頁進行網(wǎng)絡(luò)利用情況、網(wǎng)頁性能方面的診斷，并給出一些優(yōu)化建議。比如列出所有沒有用到的CSS文件等。

總結(jié)

以上是生活随笔為你收集整理的Chrome开发者工具面板功能的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。