IE WebDeveloper js debug IE下的Firebug javascript調式工具

不久之前,在IE下的調試工具我只知道IE Developer Toolbar和Companion.JS,我想這兩個工具在IE環境下的功能已經很強大了 。
IE下功能超強的調試器:IE WebDeveloper,它的功能可以和火狐下的Firebug相媲美 , 甚至有些功能還強于Firebug 。
安裝了IE WebDeveloper后會在IE頭部的工具欄中出現一個圖標,如下圖:(IE7下的效果 。)

IE WebDeveloper js debug IE下的Firebug javascript調式工具

點開后就能使用IE WebDeveloper了 。IE WebDeveloper有五個主窗口,首先是Webpage Inspector 。Webpage Inspector左邊是DOM查看器,選擇一個DOM節點會在右側對應地顯示其屬性值、HTML代碼和CSS樣式列表 。在Webpage Inspector中可以動態地修改DOM結點 , IE窗口會實時渲染展示出修改后的結果 。(Firebug也有此功能)
IE WebDeveloper js debug IE下的Firebug javascript調式工具

第二個為Script Console,這個窗口可以輸出頁面的一些信息,如錯誤信息,還能尋址到出錯代碼的位置 。可以在Javascript代碼中用console.log('信息')來輸出信息了,比alert命令好用多了 。還可以直接在里面輸入命令進行調試 。(Firebug也有此功能)
IE WebDeveloper js debug IE下的Firebug javascript調式工具

第三個為Source Explorer,查看當前頁所用到CSS和Javascript文件以及HTML源代碼,它能夠列出Javascript文件中的函數和變量名稱 。
IE WebDeveloper js debug IE下的Firebug javascript調式工具

第四個為Event Log,它能夠查看網頁瀏覽器、HTML文檔、HTML窗口或所選HTML元素結點的事件觸發列表 。
IE WebDeveloper js debug IE下的Firebug javascript調式工具

最后一個為HTTP Monitor , 它可以查看和網絡服務器相交互的HTTP信息 , 相當于Firebug的網絡(net)功能,對于AJAX開發很有幫助 。
IE WebDeveloper js debug IE下的Firebug javascript調式工具

在最后還有人推薦了一個Javascript Debug Toolkit,不過需要eclipse支持,是位國人開發的,感興趣的朋友可以看看 。
【IE WebDeveloper js debug IE下的Firebug javascript調式工具】

相關經驗推薦