啟用Visual Studio 對jQuery的智能感知

來源:互聯網
上載者:User
啟用Visual Studio 對jQuery的智能感知

首先看一下Visual Studio帶給我們的智能感知驚喜. 要讓Visual Studio支援智能感知, 需要下列條件:

  • 安裝 VS2008 SP1
    : http://msdn.microsoft.com/en-us/vstudio/cc533448.aspx
  • 安裝VS 2008 Patch KB958502以支援"-vsdoc.js"Intellisense檔案.
    該 補丁會導致Visual Studio在一個JavaScript庫被引用時,尋找是否存在一個可選的"-vsdoc.js"檔案,如果存在的話,就用它來驅動 JavaScript intellisense引擎。這些加了注釋的"-vsdoc.js"檔案可以包含對JavaScript方法提供了協助文檔的XML注釋,以及對無法自 動推斷出的動態JavaScript簽名的另外的代碼intellisense提示。你可以在"這裡"瞭解該補丁的詳情。你可以在"這裡"免費下載該補丁。
  • 必須要引用vsdoc版本的jquery庫
    <script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>

在編寫指令碼的時候, 甚至剛剛輸入"$"的時候,VS可以智能提示:

在使用方法時, 還會有更多的提示:

有了智能感知我們編寫javascript變得和C#一樣快速,便捷,舒服.大部分情況可以一次編寫成功而不用再為了一個大小寫而查詢 javascript協助檔案.能夠讓Visual Studio對jQuery實現智能感知的前提是要引入vsdoc版本的jQuery類庫. 樣本中我們引入了"jquery-1.3.2-vsdoc2.js"檔案. 如果引用其他版本比如min版本的jQuery類庫就無法啟用智能提示.但是在正式環境下, 我們必須要使用"min"版本的jquery庫檔案, 以1.3.2版本號碼為例,各個版本的大小如下:

其中第一個是未壓縮的jquery庫. 如果啟用gzip壓縮並且使用min版本的jquery.js可以在傳輸過程中壓縮到19KB.

注意,如果我們更新了指令碼, 可以通過"Ctrl+Shift+J"捷徑更新Visual Studio的智能感知,或者單擊 編輯->IntelliSense->更新JScript Intellisense:

為了即能在Visual Studio中增加指令碼提示, 又能在上線的時候使用min版本的指令碼庫, 我們一般是用如下方式引入jQuery庫:

1. 控制編譯結果
<script type="text/javascript" src="scripts/jquery-1.2.6.min.js"></script>
<%if (false)
{ %>
<script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>
<%} %>

這是網上推薦的方式. 編譯後的頁面上只有min版本的引用, 同時在開發時能夠享受到智能感知.但是注意這種方式引用的min類庫只能是1.2.6或者之前的版本號碼. 最新的1.3.2的所有非vsdoc版本的jquery庫引用後都會導致JScript Intellisense更新出錯. 這是1.3.2版本的一個bug, 期待後續版本中解決. 其實大家完全可以使用1.2.6版本的min庫, 本教程涉及的jquery功能, 1.2.6版本基本都支援.

我們使用了if(false)讓編譯後的頁面不包含vsdoc版本jquery庫的引用, 同樣的思路還可以使用比如將指令碼引用放入一個PlaceHolder並設定visible=fasle等.

2. 使用後端變數

為了能使用 1.3.2 版本的min庫, 我們只能通過將指令碼引用放在變數裡, 通過頁面輸出的方式, 此種方式可以正常更新JScript Intellisense.但是可能有人和我一樣不喜歡在前端使用變數:

<asp:PlaceHolder Visible="false" runat="server">
<script type="text/javascript" src="scripts/jquery-1.3.2-vsdoc2.js"></script>
</asp:PlaceHolder>
<% =jQueryScriptBlock %>

後台聲明變數:

protected string jQueryScriptBlock = @"<script type=""text/javascript"" src=""scripts/jquery-1.3.2.min.js""></script>";
 
在獨立的.JS檔案中啟用指令碼智能感知

上面我們解決了在頁面中智能感知的問題, 其實在獨立的.js檔案中我們同樣可以啟用指令碼的智能感知, 在IntellisenseDemo.js檔案中,添加如下語句:

/// <reference path="jquery-1.3.2-vsdoc2.js" />
 

更新JScript Intellisense, 會發現在指令碼中也啟用了智能提示:

注意,本文中講解的指令碼智能感知不僅適用於jQuery類庫, 還適用於自己編寫的javascript代碼.

相關文章

聯繫我們

該頁面正文內容均來源於網絡整理,並不代表阿里雲官方的觀點,該頁面所提到的產品和服務也與阿里云無關,如果該頁面內容對您造成了困擾,歡迎寫郵件給我們,收到郵件我們將在5個工作日內處理。

如果您發現本社區中有涉嫌抄襲的內容,歡迎發送郵件至: info-contact@alibabacloud.com 進行舉報並提供相關證據,工作人員會在 5 個工作天內聯絡您,一經查實,本站將立刻刪除涉嫌侵權內容。

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.