JavaScript 函式庫


JavaScript 函式庫 - jQuery、Prototype、MooTools。

JavaScript 框架（函式庫）

JavaScript 高階程式設計（特別是對瀏覽器差異的複雜處理），通常很困難且耗時。

為了回應這些調整，許多的 JavaScript (helper) 函式庫應運而生。

這些 JavaScript 函式庫常被稱為 JavaScript 框架。

在本教學中，我們將了解一些廣受歡迎的JavaScript 框架：

  • #jQuery

  • ##Prototype

  • MooTools

所有這些框架都提供針對常見JavaScript 任務的函數，包括動畫、DOM 操作以及Ajax 處理。

在本教程中，您將學習如何開始使用它們，這使得 JavaScript 程式設計更容易、更安全且更有樂趣。

jQuery

jQuery 是目前最受歡迎的 JavaScript 框架。

它使用 CSS 選擇器來存取和操作網頁上的 HTML 元素（DOM 物件）。

jQuery 同時提供 companion UI（使用者介面）和外掛程式。

許多大公司在網站上使用jQuery：

  • Google

  • Microsoft

  • ##IBM

  • Netflix

如需更深入學習jQuery，請造訪我們的jQuery 教學。

Prototype

Prototype

是一種函式庫，提供用於執行常見 web 任務的簡單 API。

API

是應用程式介面（Application Programming Interface）的縮寫。它是包含屬性和方法的程式庫，用於操作 HTML DOM。

Prototype 透過提供類別和繼承，實現了對 JavaScript 的增強。

MooTools

MooTools

也是一個框架，提供了一個常見的 JavaScript 程式設計更為簡單的 API。

MooTools 也含有一些輕量級的效果和動畫函數。

其他框架

下面是其他一些在上面未涉及的框架：

YUI

- Yahoo! User Interface Framework，涵蓋大量函數的大型函式庫，從簡單的JavaScript 功能到完整的internet widget。

Ext JS

- 可自訂的 widget，用於建立富因特網應用程式（rich Internet applications）。

Dojo

- 用於 DOM 操作、事件、widget 等的工具包。

script.aculo.us

- 開源的 JavaScript 框架，針對視覺效果和介面行為。

UIZE

- Widget、AJAX、DOM、範本等等。

CDN -內容傳遞網路

您總是希望網頁可以盡可能地快。您希望頁面的容量盡可能地小，同時您希望瀏覽器盡可能地進行快取。

如果許多不同的網站使用相同的 JavaScript 框架，那麼把框架庫存放在一個通用的位置供每個網頁分享就變得很有意義了。 ###

CDN (Content Delivery Network) 解決了這個問題。 CDN 是包含可分享程式碼庫的伺服器網路。

Google 為一系列JavaScript 函式庫提供了免費的CDN，包括：

  • #jQuery

  • ##Prototype

  • #MooTools

  • Dojo

  • #Yahoo! YUI

但是由於Google 在中國經常被GFW（防火長城，英文名稱Great Firewall of China，簡寫為Great Firewall，縮寫GFW）屏蔽，造成訪問不穩定，所以建議使用百度靜態資源公共庫:

http://cdn .code.baidu.com/。

如需在您的網頁中使用JavaScript 框架庫，只需在 <script> 標籤中引用該庫：

引用jQuery

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

#使用框架

在您決定為網頁使用JavaScript 框架之前，首先對框架進行測試是明智的。

JavaScript 框架很容易進行測試。您無需在電腦上安裝它們，同時也沒有安裝程式。

通常您只需從網頁中引用一個庫檔案。

在本教學的下一章，我們會為您完整地講解 jQuery 的測試過程。

→