1、窗體頂端重復(fù)容易，改變很難java,不錯(cuò)的玩具 BlogJava    首頁(yè)    新文章    新隨筆    聚合    管理 posts - 21,  comments - 21,  trackbacks - 0 Internet Explorer 下的腳本調(diào)試器          今天，我想向大家介紹一下 IE 的調(diào)試工具，因?yàn)榻?jīng)常

2、聽(tīng)到一些剛?cè)腴T(mén)的 JavaScript 開(kāi)發(fā)人員抱怨說(shuō)，沒(méi)有好的 JavaScript 開(kāi)發(fā)環(huán)境，沒(méi)有好用的調(diào)試器，沒(méi)有集成的 IDE 工具。2005 年，一個(gè)被稱做 Aptana 的免費(fèi)開(kāi)源項(xiàng)目啟動(dòng)了，但是直到 2006 年底，才為人們所知。新年伊始，對(duì)于開(kāi)發(fā)人員來(lái)說(shuō)，這個(gè) Ajax 開(kāi)發(fā)環(huán)境無(wú)疑是個(gè)好消息。本篇不想介紹這個(gè)新生兒，我只是想介紹一個(gè)被微軟藏著掖著，總也不放到明面兒上，讓大家都知道的工具“Microsoft 腳本編輯器”。當(dāng) IE 被升級(jí)到 5.5 以上之后，那個(gè)所謂的“Windows Script Debugger”其實(shí)已經(jīng)與 IE 的 JavaScript 開(kāi)發(fā)不兼容了，許

3、多對(duì)象的屬性值根本無(wú)法被正確的監(jiān)視。但是做為替代品，“Microsoft 腳本編輯器”恰恰可以彌補(bǔ)這個(gè)不足，它的強(qiáng)大，足以應(yīng)付 IE 下網(wǎng)頁(yè)腳本的開(kāi)發(fā)。這個(gè)工具被捆綁在“Microsoft Development Environment”環(huán)境中，如果你安裝有“Microsoft Visual Studio .NET”，或者“Microsoft Office XP(10.0”以上的版本，你都可以使用這個(gè)腳本調(diào)試工具。由于這個(gè)工具是微軟自己開(kāi)發(fā)的，所以運(yùn)行效率很高，并且與 IE 的兼容性也是最好的。因?yàn)椤癕icrosoft Visual Studio .NET”太大了，所以通過(guò) Office 來(lái)安

4、裝這個(gè)工具，就顯得特別有意義。安裝此工具的方法比較特殊，因?yàn)樗峭ㄟ^(guò)“Office Word”來(lái)引導(dǎo)安裝的。下面，通過(guò)安裝過(guò)程的截圖，你可以了解到如何安裝這個(gè)工具。完成上面那個(gè)的“Internet 選項(xiàng)”設(shè)置之后，關(guān)閉所有已經(jīng)打開(kāi)的 IE 窗口，然后再運(yùn)行 IE。你會(huì)發(fā)現(xiàn)在 IE 的“查看”菜單下，多了一個(gè)“腳本調(diào)試程序”項(xiàng)，如下圖所示至此，“Microsoft 腳本編輯器”便安裝完畢了。當(dāng)你瀏覽的網(wǎng)頁(yè)出現(xiàn)腳本語(yǔ)法錯(cuò)誤或?qū)崟r(shí)運(yùn)行錯(cuò)誤時(shí)，瀏覽器將自動(dòng)彈出如下的窗口，提示你是否調(diào)試此錯(cuò)誤。而當(dāng)你沒(méi)有安裝此工具前，所有的腳本錯(cuò)誤只能通過(guò)點(diǎn)擊瀏覽器狀態(tài)欄的左下角，彈出錯(cuò)誤提示窗口來(lái)查看，而這顯然是“幼

5、稚”的方法，起到的作用也如“盲人摸象”一般。雖然這個(gè)工具可以用來(lái)解決腳本運(yùn)行時(shí)的錯(cuò)誤，但有時(shí)我們只想跟蹤程序的邏輯，或者熟悉 DOM 對(duì)象的 API。也許被跟蹤的代碼任何錯(cuò)誤也沒(méi)有，或者我們只想看看在某一時(shí)刻，某個(gè) DOM 對(duì)象的某個(gè)屬性是否能被訪問(wèn)。在所有的語(yǔ)言調(diào)試環(huán)境中，通用的方法就是設(shè)置“斷點(diǎn)”，而這個(gè)工具對(duì)于“斷點(diǎn)”的支持不像 Firebug 或 JavaScrip Debugger 那樣好，可以調(diào)出已經(jīng)裝載在當(dāng)前網(wǎng)頁(yè)中的任何腳本，以便隨時(shí)的添加斷點(diǎn)。所以，利用“Microsoft 腳本編輯器”動(dòng)態(tài)地設(shè)置腳本斷點(diǎn)，來(lái)進(jìn)行跟蹤調(diào)試是非常不方便的。對(duì)于這種情況，我們需要在代碼中人為地制造一

6、些斷點(diǎn)，達(dá)到方便調(diào)試的目的。比如，有如下的代碼片段var person = name: "Lewis", gender: "male", blogURL: "" var years = 2000, 2001, 2002, 2004, 2005, 2006; person.employmentYears = years; 以上是一段語(yǔ)法正確的 JavaScript 代碼。然而，初學(xué)者可能只是想了解對(duì)象是如何被實(shí)例化，代碼是如何被運(yùn)行的。IE 的 JavaScript 解釋器提供了一個(gè)保留的 de

7、bugger 語(yǔ)句（VBScript 調(diào)試的等價(jià)關(guān)鍵字是 stop），它可以告訴瀏覽器調(diào)出調(diào)試程序，以此達(dá)到設(shè)置斷點(diǎn)的目的。對(duì)于上面的代碼，假設(shè)我想了解一下 person 對(duì)象和 years 數(shù)組的存儲(chǔ)結(jié)構(gòu)，那么我可以在代碼的入口處添加一條 debugger 語(yǔ)句，更改后的代碼片段如下debugger var person = name: “Lewis”, gender: “male”, blogURL: “”; var years = 2000, 2001, 2002, 2004, 2005, 2006; person.employmentYears

8、 = years; 當(dāng)代碼在瀏覽器中被裝載并運(yùn)行時(shí)，它會(huì)解釋 debugger 語(yǔ)句，彈出是否調(diào)試的窗口。同樣，我做了一些截圖，用來(lái)演示如何達(dá)到查看變量存儲(chǔ)結(jié)構(gòu)的目的此時(shí)，斷點(diǎn)停留在 alert(a 那一行，其實(shí)這一行是故意添加的錯(cuò)誤代碼，只是為了產(chǎn)生一個(gè)斷點(diǎn)。因此，可以像下圖那樣，跳過(guò)此行代碼的執(zhí)行，直接轉(zhuǎn)到給 person 對(duì)象賦值那一行。現(xiàn)在，我們可以“逐語(yǔ)句”的單步執(zhí)行了，這樣被監(jiān)視變量的每一次細(xì)微變化，都可以被監(jiān)視得一清二楚。“工欲善其事，必先利其器”，“君子性非異也，善假于物也”，說(shuō)得都是這個(gè)道理。好了，希望那些在 IE 下開(kāi)發(fā) JavaScript 的程序員，不會(huì)再抱怨沒(méi)有好的調(diào)

9、試工具了，因?yàn)槔骶驮谀闶种小?posted on 2007-07-20 13:46 分享愛(ài)的空間 閱讀(875 評(píng)論(0  編輯  收藏 新用戶注冊(cè)  刷新評(píng)論列表  盛大Bambook程序達(dá)人賽IT新聞：· Android應(yīng)用總數(shù)非官方統(tǒng)計(jì)達(dá)到20萬(wàn)· 開(kāi)開(kāi)街旁開(kāi)放API背后：LBS從工具向社區(qū)轉(zhuǎn)型· PHPCMS V9正式版今日火爆上市 堅(jiān)持開(kāi)源開(kāi)放· 美法官裁定SAP必須向甲骨文支付判決前利息· Mozilla網(wǎng)站意外曝光4.4萬(wàn)用戶隱私信息博客園  博問(wèn) 

10、 IT新聞  Java程序員招聘 標(biāo)題請(qǐng)輸入標(biāo)題姓名請(qǐng)輸入你的姓名主頁(yè)請(qǐng)輸入驗(yàn)證碼 驗(yàn)證碼*  內(nèi)容(請(qǐng)不要發(fā)表任何與政治相關(guān)的內(nèi)容 請(qǐng)輸入評(píng)論內(nèi)容Remember Me?  登錄       使用Ctrl+Enter鍵可以直接提交每天10分鐘，輕松學(xué)英語(yǔ) 推薦職位：· .NET 開(kāi)發(fā)工程師 (北京世紀(jì)英博· .NET 高級(jí)軟件工程師 (蘇州統(tǒng)購(gòu)信息· 網(wǎng)站運(yùn)營(yíng)人員(蘇州統(tǒng)購(gòu)信息· .NET開(kāi)發(fā)工程師(北京網(wǎng)路時(shí)代· 急聘.NET/Web開(kāi)發(fā)工程

11、師(武漢百納信息技術(shù)· .NET開(kāi)發(fā)工程師(上海蓋世網(wǎng)絡(luò)· Windows底層開(kāi)發(fā)工程師(C+(北京網(wǎng)路時(shí)代· 北京中級(jí).NET工程師(北京盛安德博客園首頁(yè)隨筆：· 取得祖先元素2· 一起學(xué)Windows phone7開(kāi)發(fā)系列視頻課程· 獲獎(jiǎng)公告“博客無(wú)雙”12月27日第一期獲獎(jiǎng)名單· Windows API Code Pack V1.1· C#基礎(chǔ)備忘13-接口知識(shí)庫(kù)：· perl工具· 也談ASP.NET 中的身份驗(yàn)證· 成功軟件項(xiàng)目管理的奧秘· 詳解數(shù)據(jù)庫(kù)中的分頁(yè)、內(nèi)存

12、和I/O延遲· VS調(diào)試Tip集結(jié)最簡(jiǎn)潔閱讀版式：Internet Explorer 下的腳本調(diào)試器網(wǎng)站導(dǎo)航: 博客園   IT新聞   知識(shí)庫(kù)   博客生活   IT博客網(wǎng)   C+博客   博問(wèn)   管理  <2010年12月>日一二三四五六2829301234567891011121314151617181920212223242526272829303112345678常用鏈接 我的隨筆 我的評(píng)論 我的參與 最新評(píng)論

13、 留言簿(4 給我留言 查看公開(kāi)留言 查看私人留言 隨筆檔案 2009年5月 (1 2009年4月 (1 2009年2月 (1 2008年12月 (1 2008年10月 (2 2008年7月 (2 2008年5月 (1 2008年3月 (1 2008年2月 (2 2008年1月 (2 2007年12月 (1 2007年8月 (1 2007年7月 (2 2007年6月 (1 2007年5月 (1 文章檔案 2009年2月 (1 2008年10月 (2 2008年7月 (1 2008年3月 (1 2008年2月 (1 2007年11月 (2 2007年8月 (1 2007年7月 (1 2007年6

14、月 (1 2007年5月 (4 相冊(cè) aa 搜索   最新評(píng)論 1. re: 如何在web.xml文件中引入其他的xml文件未登錄 經(jīng)過(guò)驗(yàn)證，使用相對(duì)路徑時(shí)，確實(shí)是會(huì)去找tomcat/bin目錄 -ECHO 2. re: 在resin服務(wù)器上使用gzip壓縮 評(píng)論內(nèi)容較長(zhǎng),點(diǎn)擊標(biāo)題查看 -遙方 3. re: 在resin服務(wù)器上使用gzip壓縮 你好，我這樣配置了怎么沒(méi)有壓縮呢？能否細(xì)談下我的郵箱hkebao -hkebao 4. re: 如何在web.xml文件中引入其他的xml文件 評(píng)論內(nèi)容較長(zhǎng),點(diǎn)擊標(biāo)題查看 -分享愛(ài)的空間 5. re: 如何在web.xml文件中引入其他的xml文件 評(píng)論內(nèi)容較長(zhǎng),點(diǎn)擊標(biāo)題查看 -G 閱讀排行榜 1. 在eclipse中添加自定義的注釋(2434 2. 如何利用eclipse實(shí)現(xiàn)批量修改文件的編碼方式(2398 3. oracle存儲(chǔ)過(guò)程中數(shù)組的使用(2348 4. linux壓縮和解壓縮命令大全(2065 5. 用oracle客戶端軟件查看oracle