JQuery

jQuery是一套迒瀏覽器的 JavaScript 函式庫，用佇簡化 HTML 佮 JavaScript 之間的操作。約翰 ・ 雷西格（John Resig）佇二空空六年一月的 BarCamp NYC 上釋出了頭一个版本。目前由 Dave Methvin 領導的團隊進行開發。全球前十 , 零一个存取上懸的網站內底，有百分之六十五使用矣 jQuery，是捌上受歡迎的 JavaScript 函式庫。

簡介

jQuery 是開源軟體，使用 MIT 授權條款授權。jQuery 的語法設計予真濟操作變甲真簡單，如操作文件（document）、 來選擇文件模型（DOM）元素、建立動畫效果、去處理事件、猶閣有開發 Ajax 程式。jQuery 嘛提供予開發人員佇咧其上的建立外掛程式的能力。這予人開發會當對底層互動佮動畫、進階效果佮進階主題化的組件進行抽象化。模組化的方式使 jQuery 函式庫會當建立功能強大的動態網頁和網路應用程式。

微軟佮諾基亞已經宣佈佇𪜶的平台頂懸縖結 jQuery。微軟上早咧 Visual Studio 中整合矣 jQuery 以便在微軟家己的 ASP . NET AJAX 框架佮 ASP . NET MVC Framework 中使用，諾基亞是佇伊的 Web 執行的時組件開發平台中整合了 jQuery。MediaWiki 自從一鋪一六版本了後也開始使用 jQuery。

jQuery 一孵三版了後，引入全新的層疊樣來表（CSS）選擇器 ia̋n-jín Sizzle。同時無閣提供 Packed 版本，因為解壓縮所消磨的時間，佮遠大於所節省的下載時間，而且不利用除錯，而且已有 Google AJAX Libraries API 等公開站台提供 jQuery 的 js 的參照服務，故 Packed 版本原本的優點已經是大概無存。

特色

jQuery 有下列的特色：

• 使用濟瀏覽器開源選擇器 ia̋n-jín _ Sizzle _（jQuery 專案的衍生產品）進行 DOM 元素選擇
• 是因為 CSS 對器的來講 DOM 操作，使用元素的名稱和屬性（如 id 和 class）作為選擇 DOM 中節點的條件
• 事件
• 特效佮動畫
• Ajax
• Deferred 和 Promise 物件來控制非同步來處理
• JSON 解析
• 通過外掛程式擴充
• 工具函式，如特徵檢測
• 現代瀏覽器內底原生的相容性方法，但是對舊版瀏覽器需要後備（fallback）方法，比如講 ` inArray ( ) ` 和 ` each ( ) `
• 濟瀏覽器（毋通佮跨瀏覽器相濫摻）支援

瀏覽器支援

jQuery 三更零及後版本支援「當前 − 一版本」的 Firefox、Chrome、Safari、Edge（就是講當前穩定版本以及當前穩定版本進前的一个版本）， 另外閣支援 Internet Explorer 九以後的 IE 版本。咧行動端支援 iOS 七 + 和 Android 四配零 +。

用法

載入 jQuery

jQuery 庫是包含所有公共 DOM、事件、效果佮 Ajax 函式的一个 JavaScript 檔案。會當通過連結到本地副本抑是公共侍服器提供的濟濟副本之一共 jQuery 包含佇彼个網頁內底。jQuery 有一个由 MaxCDN 代管的內容傳遞網路（CDN）。 Google 微軟仔也代管矣 jQuery。

嘛會當直接對 CDN 中載入 jQuery：

使用風格

jQuery 有兩種使用風格：

• 通過 jQuery 物件的工場方法 ` $ ` 函式。遮的函式通常稱做 _ 命令 _，使用方法鏈來進行呼叫，因為𪜶攏倒轉去 jQuery 東西。
• 通過 ` $ . ` 開頭的函式。這是 _ 工具函式 _，𪜶無直接作用佇咧 jQuery 東西。

佇咧 jQuery 中存取佮操作濟个 DOM 節點通常對用 CSS 選擇器字串呼叫 ` $ ` 函式開始。這會閣倒轉來一个參照 HTML 頁面內底所有匹配元素的 jQuery 東西。比如講 ` $ ( " div . test " ) `，會倒轉去一个有 class ` test ` 的所有 ` div ` 元素的 jQuery 東西。會當通過呼叫轉去的 jQuery 物件抑是節點本身的方法來操作這个節點集。

無衝突模式

jQuery 閣有 ` . noConflict ( ) ` 模式，這會敨放著 ` $ ` 的控制。若其他的庫嘛使用 ` $ ` 做這个若別碼，這个模式會較有路用。在無衝突模式下，開發人員會使用 ` jQuery ` 替代 ` $ ` 而且袂缺失任何功能。

典型的代碼開頭

通常，jQuery 是通過共初初的化代碼佮事件處理定定囥入去 ` $ ( _ handler _ ) ` 中來使用的。做瀏覽器構建 DOM 並且送載入事件的時陣摸發。

抑是講咱嘛會使用因為歷史的原因，` $ ( document ) . ready ( callback ) ` 已經成做 DOM 就緒時執行代碼的實質性標誌。猶毋過 jQuery 三更零以後，鼓勵開發人員使用閣較簡短的 ` $ ( handler ) ` 標誌。

對猶未載入去的元素進行事件處理的回呼函式會當做為匿名函式佇咧 ` . ready ( ) ` 內部註冊的。遮的事件處理常式只會佇咧觸發事件的時陣予人稱呼叫。比如講，下跤的代碼添加一个，用於在 ` img ` 圖像元素上單挵鼠事件的處理常式。

連結（Chaining）

jQuery 命令通常倒轉來一个 jQuery 東西，就按呢命令會當連結：

這途去揣著矣所有的 class 屬性為 ` test ` 的 ` div ` 標籤，以及所有 class 屬性為 ` quote ` 的 ` p ` 標籤的併集，所有匹配的元素攏增加一个 ` blue ` 的 class 屬性，而且用一个動畫增加𪜶的懸度。函式 ` $ ` 佮 ` add ` 影響匹配的元素有佗一寡，而且 ` addClass ` 和 ` slideDown ` 影響著參照的節點。

一寡仔 jQuery 函式返回特定的值（比如講 ` $ ('# input-user-email') . val ( ) `）。 佇咧遮的情況下，因為值得無參照 jQuery 東西，連結共無欲挃嘛用。

建立新的 DOM 元素

除了通過 jQuery 物件階層的存取 DOM 節點外，若做參數傳達予 $ ( ) 彼字攕看起來有成 HTML，嘛會當來建立新的 DOM 元素。比如講，這途來揣著 ID 為 ` carmakes ` 的 HTML ` select ` 元素，並會增加一个 value 屬性為 " VAG "、文字為 " Volkswagen " 的 ` option ` 元素：

工具函式

帶有 ` $ . ` 字條的 jQuery 函式是工具函式，或者是講影響全域屬性佮行為的函式。下跤的例使用了函式 ` each ( ) ` 來遍歷陣列：

這會將「二」，「 三」，「 四」寫入控制台。

Ajax

使用 ` $ . ajax ( ) ` 會當執行迒瀏覽器的 Ajax 請求。其相關的方法會當載入佮處理遠端的資料。

本範例將資料 ` name=John ` 和 ` location=Boston ` 釋出來到侍服器頂懸的 ` / process / submit . php `。當這个請求結束的時陣，會呼叫 success 函式來提醒使用者。若講請求失敗，伊會提醒使用者，告知該請求的狀態佮特定的錯誤。

非同步

請注意，頂懸的彼个例使用 ` $ . ajax ( ) ` 的延期性來處理伊的非同步特性：` . done ( ) ` 和 ` . fail ( ) ` 建立干焦佇非同步過程完成的時才執行的回呼。

發佈版本

JQuery 目前分做一 . x 版、二 . x 版、三 . x 版，這三種發佈版本，後兩種就無閣再支援 IE 七分之六 / 八，前者透過 jQuery Migrate plugin 佮進前版本保持相容。

子專案

以下專案攏是對 Interface 掛程式

jQuery UI

是因為 jQuery 的使用者介面庫，包括拖沙、縮放、對話方塊、標籤頁等等真濟个組件。

jQuery Tools

jQuery Tools 是一个第三方的套件，是因為 jQuery。包括著這个標籤頁、表單驗證、滑鼠輪輪事件等等真濟个組件。

jQuery Mobile

是因為 jQuery 的手機仔網頁做工具，jQuery Mobile 的網站頂懸包含網頁的設計工具、主題設計工具。另外咧 jQuery Mobile 的 js 外掛程式包含了換頁、事件等等的多項功能。

參閱

• jQuery UI

競品

• Prototype JavaScript 框架
• MooTools

相關冊

英文

中文

外部連結

• jQuery 官方網站
• jQuery UI 官方網站
• jQuery-Google Code（各版本 JQuery 的下載處）
• YouTube 上的 jQuery（二空空八年四月初三，Google Tech Talks）
• Github 上的 jQuery 原始碼