這兩種方式,都可以使用Visual Studio來(lái)進(jìn)行調(diào)試,先看大家用得比較頻繁的網(wǎng)頁(yè)腳本程序的調(diào)試:
1. 要調(diào)試網(wǎng)頁(yè)里面的腳本程序,調(diào)試器需要宿主程序—這里也就是IE的支持,實(shí)際上所有的腳本程序解釋器都實(shí)現(xiàn)了一個(gè)COM的調(diào)試接口。調(diào)試器通過(guò)查詢解釋器的這個(gè)接口,可以設(shè)置斷點(diǎn),查詢變量以及捕捉異常,當(dāng)然,查詢到這個(gè)接口,需要宿主程序同意……至于如何實(shí)現(xiàn)這個(gè)接口,我們會(huì)在以后的文章里面講到。
2. 默認(rèn)情況下,IE是將腳本調(diào)試支持功能關(guān)閉的,因此你需要顯示地打開它。打開IE,點(diǎn)擊“工具”—“Internet 選項(xiàng)”,在“Internet 選項(xiàng)”里面選擇高級(jí)頁(yè)簽,在“設(shè)置”列表里面,找到“禁用腳本調(diào)試(Internet Explorer)”選項(xiàng),它默認(rèn)是勾選上的—將它勾掉。
3. 使用IE打開一個(gè)新的網(wǎng)頁(yè),無(wú)論是一個(gè)遠(yuǎn)程的,或者本地的(從本地硬盤打開)網(wǎng)頁(yè)。例如下面一個(gè)網(wǎng)頁(yè),另存為test.html:
復(fù)制代碼 代碼如下:
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
html xmlns="http://www.w3.org/1999/xhtml">
head>
title>JavaScript調(diào)試/title>
script language=javascript>
function onload() {
var test = unescape("http://www.google.com");
alert(test);
}
/script>
/head>
body onload="onload()">
/body>
/html>
4. 啟動(dòng)Visual Studio,點(diǎn)擊VS菜單里面的“工具”—“附加到進(jìn)程”菜單,打開“附加到進(jìn)程”窗口里面。Visual Studio其實(shí)支持很多種調(diào)試模式,調(diào)試C++(native)程序,調(diào)試.NET(托管)程序,調(diào)試腳本程序,調(diào)試Silverlight程序以及調(diào)試SQL存儲(chǔ)過(guò)程。默認(rèn)情況下,Visual Studio會(huì)根據(jù)附加的進(jìn)程類型來(lái)選擇最合適的調(diào)試模式,但是有的時(shí)候,你需要手工設(shè)置一下。例如Internet Explorer這種程序,IE可以同時(shí)運(yùn)行多種子程序,IE本身和ActiveX控件是C++/C寫成的,IE可以運(yùn)行Winform/WPF程序,IE可以運(yùn)行Silverlight程序,當(dāng)然,IE最多的還是運(yùn)行JavaScript/VB Script腳本程序。Visual Studio在附加到Internet Explorer進(jìn)程的時(shí)候,總是會(huì)被IE弄糊涂,所以我們需要手工告知Visual Studio我們希望采用什么調(diào)試模式。
在“附加到進(jìn)程”窗口里面,在“附加到…”(英文是Attach To…)文本框旁邊點(diǎn)擊“選擇”按鈕,在彈出的“選擇代碼類型”窗口里面,勾選“調(diào)試下列類型”,并選擇“腳本”。如下圖所示:
5. 接著你需要在“附加到進(jìn)程”窗口里面選擇要附加的進(jìn)程,在“可用進(jìn)程”(Available Processes)列表里面,有一個(gè)“類型”(Type)列,里面列舉了對(duì)應(yīng)進(jìn)程支持的調(diào)試模式,比如你可以看到在上圖里,好幾個(gè)iexplore.exe支持腳本和C++調(diào)試模式(Script, x86)。因此你所需要做的就是找到執(zhí)行網(wǎng)頁(yè)的進(jìn)程,這里我選擇了ID為3732的iexplore.exe,因?yàn)槟莻€(gè)是運(yùn)行第三步網(wǎng)頁(yè)的進(jìn)程。最后點(diǎn)擊“附加”(Attach)按鈕使用腳本調(diào)試模式調(diào)試指定的IE進(jìn)程。
注:細(xì)心的網(wǎng)友可能會(huì)看到,ID為1692的iexplore.exe的標(biāo)題是“JavaScript調(diào)試”—對(duì)應(yīng)的就是我們執(zhí)行網(wǎng)頁(yè)的瀏覽器進(jìn)程ID。其實(shí)在IE 8以前,選擇執(zhí)行網(wǎng)頁(yè)的瀏覽器進(jìn)程一般都是根據(jù)瀏覽器的標(biāo)題做的,但是IE 8里面有一些改變,這個(gè)變化以后的文章里會(huì)講到。
6. 附加上去以后,在網(wǎng)頁(yè)的第7行(網(wǎng)頁(yè)源碼在第三步里面)設(shè)置一個(gè)斷點(diǎn)—就跟平常調(diào)試C#和C++代碼一樣,設(shè)置好了以后,返回到IE進(jìn)程里面,刷新網(wǎng)頁(yè)。這個(gè)時(shí)候,Visual Studio應(yīng)該會(huì)在網(wǎng)頁(yè)的第7行中斷IE的執(zhí)行,你可以在“監(jiān)視”(Watch)窗口里面查看腳本變量的值:
您可能感興趣的文章:- Javascript調(diào)試工具(下載)
- Javascript調(diào)試腳本的經(jīng)驗(yàn)之談
- javascript腳本調(diào)試方法小結(jié)
- 在IE,Firefox,Safari,Chrome,Opera瀏覽器上調(diào)試javascript
- js調(diào)試工具 Javascript Debug Toolkit 2.0.0版本發(fā)布
- ie 調(diào)試javascript的工具
- Javascript 調(diào)試?yán)?Firebug使用詳解六
- Aptana調(diào)試javascript圖解教程
- 兩個(gè)JavaScript jsFiddle JSBin在線調(diào)試器
- JavaScript 錯(cuò)誤處理與調(diào)試經(jīng)驗(yàn)總結(jié)
- javascript 在firebug調(diào)試時(shí)用console.log的方法
- 調(diào)試Javascript代碼(瀏覽器F12及VS中debugger關(guān)鍵字)
- 10個(gè)基于瀏覽器的JavaScript調(diào)試工具分享
- 利用瀏覽器的Javascript控制臺(tái)調(diào)試PHP程序
- 禁用JavaScript控制臺(tái)調(diào)試的方法
- JS高級(jí)調(diào)試技巧:捕獲和分析 JavaScript Error詳解
- JavaScript調(diào)試技巧之console.log()詳解
- javascript調(diào)試之DOM斷點(diǎn)調(diào)試法使用技巧分享
- 使用Chrome調(diào)試JavaScript的斷點(diǎn)設(shè)置和調(diào)試技巧
- 谷歌瀏覽器調(diào)試JavaScript小技巧
- JavaScript如何調(diào)試有哪些建議和技巧附五款有用的調(diào)試工具