讓網頁jQuery起來
要在網頁中使用jQuery是件簡單的事，首先介紹幾個有用的資源。
不能免俗地，當然先提jQuery的官方網站(http://www.jquery.com)，官網上有完整的文件、教學、Plugin列表...
等等，也可以指引我們下載最新版本。
官方的API說明文件在改版後解說已比先前詳盡，但針對平日開發參考，我還大力推薦另一個好站: http://visualjquery.com!
Visual
jQuery將API裡的各個函數分門別類，以階層方式編排整理，並且每個API都很用心地提供明確的範例，讓人更容易了解各函數的功用。網頁的操作界面支援動態層階式的展開、收合，方便函數尋找，想當然爾，這些網頁操作互動程式都是採用jQuery開發的。Visual
jQuery網站在最近更新到1.2.6版，並新增了輸入關鍵字或選取第一個字母的查詢方式，十分方便好用，建議大家多多利用。
除了Visual
jQuery可以提供API參考，依我自己的開發經驗，由於jQuery函數眾多，很難記憶完全，寫程式時常需要能快速獲得函數名稱、用法提示，因此手邊有一張速查表(Cheat
Sheet，或叫"小抄"更傳神)是很重要的。網路上流傳的主要有兩個版本，黑白版(http://www.gscottolson.com/weblog/2008/01/11/jquery-cheat-sheet/)字體較小但資訊較詳細，彩色版(http://colorcharge.com/jquery/)字較大並有彩色，較賞心悅目。
【動手做看看】
好，讓我們開始第一個使用jQuery的網頁。在開始前，我們要先取得jquery.js(目前最新版是2009/1/14推出的1.3版，但檔案尚未齊備，此處仍以1.2.6版為例)，由官網連結到下載頁面(http://docs.jquery.com/Downloading_jQuery)，有幾個版本可供選擇:
- Minified - 經過重新排版精簡化，去除不必要的註解、空白降低檔案大小，大小約54.5KB，由於比原始碼版本小很多，適合正式上線時使用。
- Packed - 再進一步經過壓縮，大小只有30.3KB，但每次瀏覽器下載後要經過解壓縮的程序才能開始執行，適用於流量大、頻寬不足的場合。
- Uncompressed - 未壓縮的原始程式碼版本，檔案約97.8KB，但排版上較易閱讀，開發測試期間建議使用，以利學習及偵錯。
- Documentation - 配合Visual Studio 2008使用的Intellisense說明文字補充檔案，使用方法稍後再介紹。
在此，我們選擇jquery-1.2.6.js的未壓縮版，而jquery-1.2.6-vsdoc.js也一併下載回來備用。
第一個網頁很簡單，我們打算引用jQuery，並將其中的兩個<DIV>改成黑底白字。首先用Visual Studio
2008開啟一個網站專案，並建立js目錄，放入jquery-1.2.6.js，另外新增一個HTML網頁，進入原始碼編輯頁面，此時由右側Solution
Explorer將jquery-1.2.6.js拖過來，VS2008會自動在網頁上產生<script src="js/jquery-1.2.6.js"
type="text/javascript"></script>的引用標籤。
接著我們先在<body>中放入一個<div>First</div>，在其下方加入一段程式碼:
<script type="text/javascript">
$(function() {
$("div").css("color", "red").width(100).text("Hello World");
});
</script>
這裡有個$(function() { .... })的寫法，其中包含的程式碼會在網頁載入後被呼叫(相當於<body onload="...">時觸發)，原則上，會存取網頁元素的Javascript程式盡可能安排在網頁載入後再執行，否則有可能因為某些元素還沒有完全載入無法使用、或因載入期間變更HTML
DOM而導致錯誤。jQuery裡每個事件都可以多重宣告，因此一個網頁中可以宣告多個$(function() { ... })，會依宣告先後依序執行。
$("div")的寫法是所有jQuery程式的基本出發點，意指利用"div"這個Selector去搜索所有符合的元素，組成一個陣列，接著我們便可以用串接的方式，逐一指定要陣列的每個元素進行什麼作業。在此，我們透過css()設定div.style.color
= "red"，指定div.style.width="100px"，並更改div的內容文字為"Hello World"(真是老梗)。
【jQuery Intellisense】
在編輯的過程中，你可能已經發現VS2008的Javascript
Intellisense在jQuery函數上也會發生作用，當我們輸入"$("後，VS2008會提示"$(selector,
context)"，美中不足的是，打完$("div")後，後面的".css("，".width("就不再觸發提示。
記得先前到的jquery-1.2.6-vsdoc.js嗎? 輪到它上場了!!
Visual Studio 2008本身具有Javascript Intellisense的功能，但在js必須添加額外的XML
Documentation註解才能在顯示提示時附加說明文字。jQuery是獨立的Open Source
Project，自然不該在核心中加入專屬特定開發工具的Code，因此在Visual Studio
2008裡除了jquery-1.2.6.js外，再另外多載入jquery-1.2.6-vsdoc.js，則-vsdoc檔案中的註釋就會發揮效果。瞧，加入vsdoc後，不但.css有了提示，甚至還有參數的細部說明呢!
不過，這裡有個小困擾!
-vsdoc.js的內容只為了提供開發階段的文字說明，在實際傳到瀏覽器時不應載入，因此要設法將這段Code加上額外邏輯，使其只在編輯階段出現。如果是ASPX/PHP，可利用<%
if (false) {%> <% } %>包出一段實際執行永遠被忽略、但編輯階段會讀取及執行的js。
<script type="text/javascript" src="js/jquery-1.2.6.js"></script>
<script type="text/javascript" src="js/jquery-1.2.6-vsdoc.js"></script>
每次用到jQuery的地方都要來這麼一下有點煩人，於是微軟已經有了Hotfix。安裝後，VS2008會在每次載入js時，一併尋找同目錄下有沒有同名但後方多加-vsdoc的js檔案，若有則一併載入，因此我們只需將說明補充用的js取對名字，放在同一目錄下，餘下的事VS2008會替我們打理好，不用額外功夫就可以享用完整的函數說明提示了。