JQuery是由JavaScript所開發的開源函式庫，主要有以下功能大受好評而列入主流。

1. 被簡化的 DOM 控制：比起原生JavaScript更能輕鬆對DOM監管
2. 過度的轉場效果：能容易去控制CSS及配合兩者之間的過渡，也有自己的animate功能
3. AJAX使用：能直接額外背後連線網頁並將資料取回，再透過DOM寫入，達到免重整畫面就能取得。
4. 官方文件詳細
5. 簡潔不笨重，壓縮後大約 32kB
6. 只要你有 JavaScript 的基礎，不用再多去學習一大堆新語法
7. 沒有跨瀏覽器的問題，jQuery 已經處理好了
8. 支援 CSS3 選擇器
9. 社群活躍，你可以有很多人家寫好免費的 plugin 用
10. 跟其它 library 一起使用也不衝突

在使用 jQuery 之前，需要先了解基本的 JavaScript、CSS 與 HTML喔!

安裝

可以使用CDN或直接安裝到網站內，透過取得jquery.min.js。

可自行評估是使用 CDN 或下載於本機端
jQuery’s CDN 位置
jQuery 下載處

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous">
</script>

或直接下載下來放到你相同位置。就算沒有網路也可以運作

<script src="js/jquery-3.4.1.min.js"></script>

或者透過 Google CDN 載入 jQuery

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

語法說明

使用jQuery的$()為基礎並會變成 jQuery 的元件，透過jQuery元件進行相關程式指令。若要接續其他動作則以物件指向來進行行為規劃，例如：

$('li.list').addClass('color');

JQ 可接續其他對象或動作並能連續指定多種，舉個例子：

$('li.list').next().css('background-color','red').addClass('color');

• 此為先找到 DOM 中的 li 標籤同時有 class name 為 list，接著下一個標籤為對象
• 對此對象進行增加 CSS 樣式（背景色：red)
• 對此對象進行增加 class name 為 color

此為找到 DOM 中的 li 標籤同時有 class name 為 list 的對象，對此對象進行增加 class name 為 color
也可使用jQuery() 來代表 $() 之寫法，如果無法使用該符號情況下。

jQuery 開頭都是 $() 函數進行元件套用，事實上同等於 jQuery() 寫法，如果當你使用一些 JavaScript 外掛也剛好有 $() 會衝突時，你可以改寫完整語法 jQuery()。