天天看點

IE開發人員工具之實用功能講解

f12快捷鍵調出開發人員工具

一.js的内容格式化

1.内容較亂的js腳本:

IE開發人員工具之實用功能講解

2.勾選下面兩項即可進行格式化腳本:自動換行與格式化js

IE開發人員工具之實用功能講解

3.調理清楚的腳本

IE開發人員工具之實用功能講解

二:清空控制台

1.右鍵-》清空

2.console.clear()

IE開發人員工具之實用功能講解

三:用控制台代替alert()

當你需要調試代碼中的值卻又不想中斷代碼的執行時,我們可以用:

window.console.log("helloworld");

在控制台檢視。

四:調試js時的斷點快捷鍵

f9:添加/移除 斷點

f10:逐過程,即跳過該語句中的方法、表達式等

f11:逐語句調試,即單步調試,會跳入方法、表達式,進行逐語句的跟蹤調試

五:選擇相應的html與之相關的源

1.點選這個

IE開發人員工具之實用功能講解

2.擷取相應css與html

IE開發人員工具之實用功能講解

六:探查器的作用:用來檢測各個函數的調用耗時,分析網頁性能體驗

IE開發人員工具之實用功能講解

好牛掰,全是0.00 - -!我網速好,哈哈!

七:網絡的作用

IE開發人員工具之實用功能講解

1.304的結果,這表明這些資料是直接從緩存中擷取

2.200表示順利的傳回了需要的檔案

3.404表示該檔案不存在

4.503表示伺服器暫時不可用

5.500表示伺服器發生了内部錯誤等。

IE開發人員工具之實用功能講解

http的請求标頭、請求正文、響應标頭、響應正文,與該檔案下載下傳行為相關的cookie、發起程式,以及比摘要視圖中更加詳細的計時資訊。也就是說,詳細視圖已經将浏覽器如何與伺服器通信的協定層面的資訊都展示給我們了,這些資訊對于開發人員和調試人員來說無疑是不可多得的好資料,通過它們可以使網站調試工作變得非常輕松。

轉載:http://www.cnblogs.com/zqzjs/p/4684549.html

繼續閱讀