Latest web development tutorials
×

JavaScript 教程

JavaScript 教程 JavaScript 簡介 JavaScript 用法 JavaScript 輸出 JavaScript 語法 JavaScript 語句 JavaScript 註釋 JavaScript 變量 JavaScript 數據類型 JavaScript 對象 JavaScript 函數 JavaScript 作用域 JavaScript 事件 JavaScript 字符串 JavaScript 運算符 JavaScript 比較 JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript 類型轉換 JavaScript 正則表達式 JavaScript 錯誤 JavaScript 調試 JavaScript 變量提升 JavaScript 嚴格模式 JavaScript 使用誤區 JavaScript 表單驗證 JavaScript 保留關鍵字 JavaScript JSON JavaScript void JavaScript 代碼規範

JS 函數

JavaScript 函數定義 JavaScript 函數參數 JavaScript 函數調用 JavaScript 閉包

JS HTML DOM

DOM 簡介 DOM HTML DOM CSS DOM 事件 DOM EventListener DOM 元素

JS 高級教程

JavaScript 對象 JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp 對象

JS 瀏覽器 BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript 彈窗 JavaScript 計時事件 JavaScript Cookies

JS 庫

JavaScript 庫 JavaScript 測試 jQuery JavaScript 測試 Prototype

JS 實例

JavaScript 實例 JavaScript 對象實例 JavaScript 瀏覽器對象實例 JavaScript HTML DOM 實例 JavaScript 總結

JS 參考手冊

JavaScript 對象 HTML DOM 對象

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)屏蔽,造成訪問不穩定,所以建議使用百度靜態資源公共庫。

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

引用jQuery

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


使用框架

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

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

通常您只需從網頁中引用一個庫文件。

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