现在的位置: 首页 > 综合 > 正文

在 Visual Studio 2010 活用 jQuery 的开发工具使用技巧

2013年09月13日 ⁄ 综合 ⁄ 共 1987字 ⁄ 字号 评论关闭

※ Visual Studio 2010 對於 JavaScript Intellisense 的增強 ※

這次 Visual Studio 2010 對 JavaScript Intellisense 的支援增強了許多,甚至於對 jQuery
來說簡直可以說是量身打造的,不管你怎麼設定都很容易出現 jQuery 相關的 Intellisense,請參考以下例子:

你只要在 MasterPage 載入 jQuery 最小化(minify)的版本,就可以在頁面中享受 Intellsense 的好處:

而在未來即將上市的 Visual Studio 2010 中文版,甚至會有全中文的註解說明,是不是佛心來著的!

雖然你在 MasterPage 載入的是最小化過的 jQuery 版本,但 Visual Studio 2010 會自動搜尋該檔案所在目錄是否有
jquery-1.4.1-vsdoc.js
檔案,只要一經發現就會自動載入做為 Intellsense 之用。這功能在 Visual Studio 2008 也有提供 Hotfix
可供下載,詳情請見此網頁:VS2008 SP1 Hotfix to Support "-vsdoc.js" IntelliSense
Doc Files

即便你在 MasterPage 中載入的是 CDN 的 jQuery 版本,只要在專案中有載入同檔名的 jQuery,Visual
Studio 2010 一樣能幫你找到適當的 jQuery Intellisense 提示你!

若你發現 jQuery 的 Intellisense 沒有作用的話,可能是 Visual Studio 2010 尚未將專案中所有 JavaScript
Library 的 Intellisense 資訊更新,這時你可以利用 Visual Studio 2010 中的 Update JScript
Intellisense 功能 ( 快速鍵: Ctrl + Shift +
J
) 即可立即更新 JavaScript 的 Intellisense 支援。

image

 

※支援 Visual Studio 2010 的 jQuery 程式碼片段 ※

Visual Studio 2010 對程式碼片段(Code Snippets)功能也增強不少,現在除了在 cs 檔中可以使用 Code Snippets
外,也可以在 HTML/ASPX/JS 檔案中使用 Code Snippets,如果你的游標處於 HTML/ASPX 檔案中的 <script> …
</script> 裡面,Visual Studio 2010 也會自動提示與 JavaScript 相關的 Code Snippets
供您選擇。

首先你可以到 jQuery Code Snippets for Visual Studio 2010 下載 jQuery Snippets
安裝檔,目前的 jQuery Snippets 1.0 就有提供131 個與 jQuery 有關的 Code
Snippets,可說是非常實用,如果你想透過影片感受如何使用,可以參考這則教學影片:http://screencast.com/t/YjUyNDVjZD

安裝好之後,你可以試著在頁面的 <head> 區塊內輸入 <jq 即可出現 Code Snippets 提示:

選取後按下 Tab 鍵就會自動完成

【注意事項】

如果你希望在 HTML 中輸入標籤時能自動出現 Code Snippets 的 Intellisense
提示,那麼你必須先輸入一個小於符號 ( < )
才會自動出現提示,否則你也可以按下鍵盤的 Ctrl + J
快速鍵也能立即出現 Intellisense 選單。

接著你在到 JavaScript 中輸入 jq
開頭就會再提示出可用的 Code Snippets

有了這些好用的 Code Snippets 在開發過程中將會變得非常順利,少打一些字也可以減輕手指的負擔。

如果你覺得這些 Code Snippets 的內容過於老舊,你也可以自行修改安裝後的 *.snippets 檔案,這些檔案都是 XML
格式的文件,很容易看懂如何修改,如需深入研究可參考 Code Snippets Schema Reference 的說明。jQuery
Code Snippets for Visual Studio 2010
預設的安裝目錄如下:

我的文件/Visual Studio 2010/Code Snippets/Visual Web Developer

雖然在 CodePlex 上出現了一個感覺還不錯的 Snippet Designer 工具,但目前還無法支援
HTML 或 JavaScript 類型的 Code Snippets,如果你用此工具編輯這些不支援的類型的 Code Snippets
將會破壞原本的格式而導致 Code Snippets 無法正常使用,所以這點需特別小心。

你還有沒有什麼在 Visual Studio 2010 中與 jQuery
相關的開發技巧呢?歡迎留言分享!^_^

原本连接:http://blog.miniasp.com/post/2010/04/19/Visual-Studio-2010-jQuery-Development-Tips.aspx

抱歉!评论已关闭.