MooTools 1.2 JavaScript庫介紹
MooTools 1.2是個強大的輕量級的JavaScript庫，專門為減輕Web中交互性JavaScript開發。在某種程度上，你可以認為MooTools是CSS的擴展。例如，CSS可以讓你在鼠標移上去時發生改變。JavaScript允許你接觸更多的時間（點擊事件、鼠標懸停事件、鍵盤事件……），MooTools讓這一切變得非常容易。
另外，MooTools還有各種各樣的非常好的擴展，可以讓你不只是改變一個元素的屬性，還可以讓你有”morph“（變形）或者”tween“（補間動畫）屬性，讓你有能力去創建動畫效果，就像你在我的導航菜單上看到的一樣（Fdream注：原作者的，我的首頁也有）。
這只是一個例子，MooTools可以讓你做更多的事情。在接下來的30天里，我們將深入MooTools庫，探索從數組（Array）和函數（Function）到Fx.Slide，以及其他捆綁插件的每一個東西。
引用MooTools 1.2
首先，下載并引用MooTools 1.2核心庫。
下載MooTools 1.2核心庫
把MooTools 1.2核心庫上傳到你的服務器或者工作區
在你的HTML文檔頭部head標記之內鏈接MooTools 1.2核心庫
參考代碼：
復制代碼 代碼如下:
<script src="mootools-1.2-core.js” type="text/Javascript"></script>

（Fdream注：現在MooTools 1.2下載下來后，默認的后綴名是”.txt“，請更改后綴為”.js“。）
在Head標簽之內添加Script標簽
現在，你已經在你的頁面中應用了了MooTools了，你還需要一個地方來寫你的代碼。這里有兩種選擇：
1. 把下面的代碼寫在你的head標簽之內，你的代碼寫在script標記之內：
參考代碼：
復制代碼 代碼如下:
<script type="text/Javascript">
//Mootools code goes here
</script>

2. 在外部建立一個JavaScript文件，然后在頁面頭部鏈接此文件：
參考代碼：
復制代碼 代碼如下:
<script src="myJavaScriptFile.js" type="text/Javascript"></script>

在這里，你可以使用任何一種方式。我通常把domready事件中調用的方法放在script標記之間，而我的函數放在外部文件中。
把代碼放在domready中
MooTools的方法必須在domready事件中調用。
參考代碼：
復制代碼 代碼如下:
window.addEvent('domready', function() {
exampleFunction();
});

（Fdream注：不完全是這樣，但是可以保證你的JavaScript代碼盡可能少地出錯。順便說一下domready事件：當頁面的HTML代碼（不包括圖片、flash等等，只是代碼）下載完成時，此時會觸發domready事件。這樣可以在頁面完全下載完成（包括圖片、flash等都下載完成）之前執行你的腳本，從而避免因為一張大圖要下很長時間而導致腳本不能執行，從而出現異常。）
把代碼放在一個函數中
你仍然可以在domready之外創建你的函數，然后在domready中調用它：
參考代碼：
復制代碼 代碼如下:
var exampleFunction = function() {
alert('hello')
};
window.addEvent('domready', function() {
exampleFunction();
});


關于庫的詳細介紹
在這第一講中，我們會仔細地看了一下這個庫架構的一些關鍵組件，然后粗略地看一下其他基本功能。
Core（核心）
核心（core）部分包含MooTools庫的一些公共函數（Function）來完成一些常見的任務，也加強了許多原有功能（后面會有詳細介紹）。下面的內容只是作為MooTools功能的一些例子，并不能替代您閱讀MooTools的文檔。
檢查一個值（如果沒有值或者為0則返回false） - $chk(value);
返回兩個值之間的一個隨機整數 - $random(min, max);
可以更容易地檢測瀏覽器、瀏覽器的引擎及瀏覽器的能力
（Fdream注：第一個描述有誤，$chk(value)只是檢查一個值是不是已經定義或者已經賦值，為0時會返回true，只有undefined或者null時返回false。）
Native（本地對象）
在庫的這一部分也包含了一些公共工具，可以讓你很容易地操作數組（Array，值或者對象的簡單列表）、函數（Function）、數值（Number）、字符串（String）、哈希對象（Hash）和事件（Event）。這里是本地對象中的一些工具特性：
對數組中的每個元素執行一段腳本 - .each();
得到數組中的最后一個元素 - .getLast();
每個x毫秒觸發一個事件 - .periodical();
對小數取整 - .round();
把rgb轉換為十六進制（HEX） - .rgbToHex();
Class（類）
一個JavaScript類（相對于CSS的類），是一個功能可以重復使用的對象。若要更多地了解MooTools類，你可以看看Valerio的這篇簡單介紹的文章（MooTools類――怎樣使用它們）。我也同時推薦David Walsh的MooTools類模板。
Element（元素）
MooTools庫的Element類提供了一些非常有用的功能。通過這個類，你可以選擇DOM元素、操控他們的屬性和位置、改變他們的CSS風格。這里是MooTools提供的一些非常強大的處理DOM元素的工具：
通過ID或者CSS類名選擇第一個指定類型的DOM元素 - .getElements();
選擇所有有相同ID或者CSS類名的DOM元素 - .getElements();
給一個元素添加一個CSS類 - .addClass();
取得一個元素的屬性值 - .getProperty();
改變一個元素的屬性值 - .setProperty();
取得一個元素的樣式屬性值 - .getStyle();
改變一個元素的樣式屬性值 - .setStyle();
取得一個元素的坐標位置 - .getCoordinates();
（Fdream注：不推薦在一個頁面中有多個相同ID，最好不要出現，在一些瀏覽器下很容易出現不可預見的錯誤。）
Utilities（實用工具）
實用工具（Utilities）提供了更多精良的選擇邏輯，包括domready事件、可以管理AJAX調用的工具、可以輕松管理cookie的工具，甚至還有”swiff“功能，可以提供JavaScript接口給ActionScript。
FX（效果）
這可能是MooTools最有趣的部分了。通過Fx（效果），你可以創建”Tween“（補間動畫）和”morph“（形變動畫）效果，從而讓你的DOM對象動起來。
在兩個樣式屬性值之間創建一個動畫變形（比如讓一個div平緩地變大） - var myFx = new Fx.Tween(element);
在多個不同的屬性值之間創建一個動畫變形（比如在讓一個div平緩變大的過程中，讓它的邊框越來越初，同時變換它的背景顏色） - var myFx = new Fx.Morph(element);
Request（請求）
包含一些可以輕松處理JavaScript XMLHttpRequest（AJAX）功能的工具。為了減輕整個請求/響應（request/response）帶來的痛苦，Request對象還有一些專門用來處理HTML和JSON對象（JavaScript對象表示法）的擴展。
Plugins（插件）
MooTools插件擴展了核心功能，可以輕松地為你的web項目添加高級UI功能。插件列表如下：
Fx.Slide
Fx.Scroll
Fx.Elements
Drag
Drag.Move
Color
Group
Hash.Cookie
Sortables
Tips
SmoothScroll
Slider
Scroller
Assets
Accordion
全局概覽
在開始下一講之前，花一點時間全面地看一下MooTools的文檔。可能有些地方你看不太懂，不要管它，盡管通讀它，然后吸收那些你懂的。在接下來的29天中，我們將逐步深入這個庫特定的部分，然后把MooTools分解成一些容易消化的小部分，但是首先，一定要好好看一下整個目錄。
更多學習
一個壓縮包，包含了你開始起步所需要的所有東西
包括一個MooTools 1.2核心庫、一個簡單的HTML文件、一個用來寫你的函數的外部的JavaScript文件、一個CSS樣式表文件。這個HTML文件已經已經寫了詳細的注釋，并包含有domready事件。

MooTools 1.2 備忘錄
這里是一份很好的MooTools 1.2功能的歸納表，我才給自己打印了一份，正在找地方把它給掛起來。也許我應該順便拜訪一下打印機，然后讓它們給我提供一張海報大小的：）。不管怎樣，這里是MooTools 1.2備忘錄的鏈接。

JavaScript技術：MooTools 1.2介紹，轉載需保留來源！

鄭重聲明：本文版權歸原作者所有，轉載文章僅為傳播更多信息之目的，如作者信息標記有誤，請第一時間聯系我們修改或刪除，多謝。