這篇文章主要為剛剛接觸前端、javaee、php等內容的萌新設計們，對于我本人也是一個對于開發(fā)者工具中Network模塊使用的一點心得和總結
chrome開發(fā)者工具最常用的四個功能模塊：
Elements：主要用來查看前面界面的html的Dom結構，和修改css的樣式。css可以即時修改，即使顯示。大大方便了開發(fā)者調試頁面，這真是十分友好的~
console：這個除了查看錯誤信息、打印調試信息(console.log())、寫一些測試腳本以外，還可以當作Javascript API查看用。例如我想查看console都有哪些方法和屬性，我可以直接在Console中輸入"console"并執(zhí)行~
Sources：主要用來調試js和查看源代碼
Network：重頭戲來了~
那我就按照從左到右的順序來寫啦~
domain：資源所在的域，即url中的域名部分。如 domain:api.github.com
has-response-header：資源是否存在響應頭，無論其值是什么。如 has-response-header：Access-Control-Allow-Origin
is：當前時間點在執(zhí)行的請求。當前可用值：running
larger-than：顯示大于指定值大小規(guī)格的資源。單位是字節(jié)(B),但是K(kB)和M(MB)也是可以的~ 如larger-than:150K
method：使用何種HTTP請求方式。如 GET
mime-type：也寫作content-type，是資源類型的標識符。如 text/html
scheme：協(xié)議規(guī)定。如 HTTPS
set-cookie-name：服務器設置的cookies名稱
set-cookie-value：服務器設置的cookies的值
set-cookie-domain：服務器設置的cookies的域
status-code：HTTP響應頭的狀態(tài)碼
當打開開發(fā)者工具時生效，打開這個開關，則頁面資源不會存入緩存，可以從Status欄的狀態(tài)碼看文件請求狀態(tài)。
設置限速可以模擬處于各種網絡環(huán)境下的不同用戶訪問本頁面的情況。
下列介紹中，前者為名詞解釋，后者為舉例
Name/Pat：資源名稱以及URL路徑 （main.css）
Method：Http請求方法 (GET或者POST)
status/Text：Http狀態(tài)碼/文字解釋 （200，ok）
Type ：請求資源的MIME類型，MIME是Multipurpose Internet Mail Extensions (html,css,js等)
Initiator：解釋請求是怎么發(fā)起的，有四種可能的值
1.Parser ：請求是由頁面的html解析時發(fā)送 2.Redirect：請求是由頁面重定向發(fā)送 3.script ：請求是由script腳本處理發(fā)送 4.other ：請求是由其他過程發(fā)送的，比如頁面里的Link鏈接點擊size/content：size是響應頭部和響應體結合的大小，content是請求解碼后的大小
點擊某個具體請求后的界面，如下圖所示：
Headers
Preview：預覽面板，用于資源的預覽。
Response：響應信息面板包含資源還未進行格式處理的內容
Timing：資源請求的詳細信息花費時間
對某請求右鍵，出現(xiàn)頁面如下圖所示。
Copy Request Headers：復制HTTP請求頭到系統(tǒng)剪貼板
Copy Response Headers：復制HTTP響應頭到系統(tǒng)剪貼板
Copy Response：復制HTTP響應內容到系統(tǒng)剪貼板
Copy as
cURL：將網絡請求作為一個curl的命令字符復制到系統(tǒng)剪貼板(curl是一種開源的命令行工具和庫，用于配合url語法進行數(shù)據(jù)傳輸)
Copy All as HAR：將網絡請求記錄信息以HAR格式復制到系統(tǒng)剪貼板(what is HAR file)
Save as HAR with Content：將資源的所有的網絡信息保存到HAR文件中(.har文件)
Clear Browser Cache：清除瀏覽器緩存
Clear Browser Cookies：清除瀏覽器cookies
Open in Sources Panel：當前選中資源在Sources面板打開
Open Link in New Tab：在新tab打開資源鏈接
Copy Link Address：復制資源url到系統(tǒng)剪貼板
若將所有的網絡信息保存到HAR文件中，點擊這里，可上傳查看
