概念

jQuery是一個JavaScript**函式庫，是一個比較流行的**js框架，功能就是簡化 js 程式碼的書寫，因為一些功能用原生javascript書寫程式碼量是很大的。可以理解為javascript query，畢竟Query也是它的一個功能。

安裝

要使用jQuery庫，可以從網上下載得到jQuery的 .js 檔案，也可以使用CDN (Content Delivery Content 內容分發網路)載入jQuery。

下載

需要去jQuery官網：jquery.com 下載需要的jQuery庫，一般有兩個版本，production 表示已被壓縮精簡的版本，用於放到實際網站中，development

例如目前最新的版本是 jquery-3.3.1.js，壓縮版字尾是 .min.js，開發版檔案有一萬多行，就是正常格式的JavaScript原始碼，包含一些註釋，檔案大小為 266k；壓縮版就是去掉裡面不必要的空格，回車與註釋，所以最後檔案實際內容只有一行！，檔案大小為 85k，壓縮了近三倍，這也是網頁都使用壓縮版，提升網頁效能的原因。

下載好後放到網頁資料夾中，然後使用 <script> 標籤引用，例如：

<script scr="/js/jquery-3.3.1.min.js"></script>

路徑中填寫 .js

CDN

使用CDN（內容分發網路）就可以不用下載jQuery檔案，優點是可以使用這個機制儘量避開網路中一些影響資料傳輸的路線，提高訪問速度和穩定性。原理就是使用在各處配置的節點伺服器，讓使用者就近獲取所需內容。

常見CDN有很多，例如百度、新浪、谷歌、微軟等，如果是國內站點的話，建議使用國內CDN，國外站點可以使用谷歌或微軟，提高速度。

以百度CDN為例，安裝方法如下：

<script src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>

微軟CDN：

<script
 
 src="http://ajax.microsoft.com/ajax/jquery/jquery-1.3.2.min.js"></script>

語法

jQuery的基礎語法是通過選取（query）文件中的元素，對其進行操作（action），語法是：

$(selector).action()

選擇器

selector 是選擇器，類似於CSS選擇器，常見的有：

• 元素選擇器，如： $("p")
• ID選擇器，如：$("#myId")
• 類選擇器，如：$(".myClass")
• 屬性選擇器，如：$("[href]")

操作

action() 是對所選元素執行的操作，例如：

• 隱藏元素：.hide()
• 單擊事件：.click(myFunction())
• 雙擊：.dblclick()
• 懸停：.hover()

其他語法與JavaScript類似，程式碼寫在 <script> 中，例如隱藏 p 元素：

<script>
    $("p").hide();
</script>

有時需要等文件載入完畢後執行程式碼，很像JavaScript中的 window.onload：

window.onload = function(){
    alert();
}

jQuery中就要這麼寫：

$(document).ready(function(){
    $("p").hide();
});

簡化寫法：

$(function(){
    $("p").hide();
});

結果都是在整個文件載入完後執行語句。

方法連結

相對於JavaScript，jQuery又一種特殊的操作方法叫做方法連結（chaining），即在一條語句上，對一個元素執行多個操作，語法是：
$(selector).action1().action2().action3()

例如：

$("p").html("<b>Hello</b>").click(function(){
    alert("Hello world");
});

結果就是改變元素文字內容後繫結點選事件的呼叫函式，操作可以繫結多個，並且是依次執行，方法類似，其他操作以此類推。