Mootools 1.2教程(3) 數組使用簡介

2024-05-06 14:14:02

字體：大中小

來源：轉載

供稿：網友

今天，我們在來看看如何使用數組來管理DOM元素。
基本方法
.each();
在處理數組時，.each();方法是你最好的朋友。它提供了一種很容易的方法來遍歷數組的每個元素，如果有需要還可以對其中的元素進行任何邏輯處理。例如，我們可以假設你需要為頁面中的每個div對象調用alert方法：
參考代碼：代碼如下:
$$('div').each(function() {
alert('a div');
});

如果使用下面的HTML代碼，上面的JavaScript代碼將彈出兩個alert對話框，每個div一個。
參考代碼：代碼如下:
<div>One</div>
<div>Two</div>

.each();方法不需要你使用$$方法。創建一個數組的另一種方式（就像我們昨天講到過的）是使用.getElements();方法。
參考代碼：代碼如下:
$('body_wrap').getElements('div').each(function() {
alert('a div');
});

參考代碼：代碼如下:
<div id="body_wrap">
<div>One</div>
<div>Two</div>
</div>

還有另外一種方法來完成這個相同的任務，就是把這個數組賦值給一個變量，然后對那個變量使用.each();方法：
參考代碼：代碼如下:
// 首先你需要通過語句”var VARIABLE_NAME“來聲明一個變量
// 然后用等于運算符”=“來給這個變量賦值
// 在這個例子中，是一個包含div元素的數組
var myArray = $('body_wrap').getElements('div');
// 現在你就可以把這個變量當數組選擇器使用了
myArray.each(function() {
alert('a div');
});

最后，如果你可能想把你的函數從選擇器中獨立出來。我們會在明天的關于使用函數的教程中更深入地講解這個問題。不過，現在我們可以創建一個非常簡單的示例：
參考代碼：代碼如下:
var myArray = $('body_wrap').getElements('div');
// 要創建一個函數，你可以像剛才一樣聲明一個變量，然后給它命名
// 在等號后面使用”function()“來聲明這個變量為一個函數
// 最后，在 { 和 }之間寫入你的函數代碼
var myFunction = function() {
alert('a div');
};
// 現在你就可以在.each();.方法里面調用剛才的函數了
myArray.each(myFunction);

注意：當你像剛才那樣在.each();.方法里面調用函數時，你不需要給函數名加上引號。
復制一個數組
$A
MooTools提供了一個簡單的方式——通過$A函數來復制一個數組。讓我們像剛才那樣使用變量創建一個數組：
參考代碼：代碼如下:
// 創建你的數組變量
var myArray = $('body_wrap').getElements('div');

復制一個數組（創建該數組的副本）：
參考代碼：代碼如下:
// 建立一個新的變量名，命名為”myCopy“，然后把”myArray“的副本賦值給它
var myCopy = $A(myArray );

從數組中獲取指定的元素

上一篇：javascript類繼承機制的原理分析

下一篇：javascript 數組操作實用技巧