JavaScript 教程之JavaScript常用框架簡介

JavaScript 框架（庫）

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

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

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

 

JavaScript 常用框架：

• jQuery

• Prototype

• MooTools

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

 

 

 

1.jQuery

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

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

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

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

• Google
• Microsoft
• IBM
• Netflix

 

 

2.Prototype

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

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

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

 

 

3.MooTools

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

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

 

 

4.其他框架

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

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、模板等等。

 

 

5.CDN - 內容分發網路

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

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

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

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

• jQuery
• Prototype
• MooTools
• Dojo
• Yahoo! YUI

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

引用 jQuery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>

 

 

6.使用框架

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

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

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

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