网络编程
位置:首页>> 网络编程>> JavaScript>> Mootools 1.2教程(3)——数组使用简介(4)

Mootools 1.2教程(3)——数组使用简介(4)

作者:Fdream 来源:Fdream博客 发布时间:2008-11-17 20:16:00 

标签:数组,mootloos,教程,javascript,库

代码示例

数组可以让你遍历包含所有项目的列表,并对每个元素执行相同的代码。在这个例子中,注意变量”item“作为当前元素的替代符的使用。

参考代码:

// 创建一个数组,这个数组包含”body_wrap“里面所有CSS类名为.class_name的元素
var myArray = $('body_wrap').getElements('.class_name');
 
// 首先建立一个要添加到数组中的元素
var addSpan = $('addtoarray');
// 然后建立一个要合并的数组
var addMany = $$('.addMany');
 
// 现在我们把元素addSpan加入到数组中
myArray.include(addSpan);
// 然后合并数组addMany到myArray中
myArray.combine(addMany);
 
// 建立一个需要对数组中的每个元素都要执行的函数
var myArrayFunction = function(item) {
// item现在指向数组中的当前元素
item.setStyle('background-color', '#eee');
}
 
// 现在对数组中的每个项目调用myArrayFunction函数
myArray.each(myArrayFunction);


参考代码: 

<div id="body_wrap">
    <div class="class_name">one</div><!-- this has gray background -->
    <div>two</div>
    <div class="class_name">three</div><!-- this has gray background -->
    <span id="addtoarray">add to array</span>  <!-- this has gray background -->
    <br /><span class="addMany">one of many</span>  <!-- this has gray background -->
    <br /><span class="addMany">two of many</span>  <!-- this has gray background -->
</div>


延伸学习

这个教程并没有打算涵盖你能对数组做的全部事情,但是希望能够给你一个参考,告诉你MooTools提供了一些什么功能。要学习更多关于数组的东西,请仔细阅读这些内容:

下载一个包含你开始所需要的所有东西的zip包

asp之家下载:mootorial_day3_arrays.zip (27.25 KB)

包括一个简单的html文件、MooTools 1.2核心库、一个外部JavaScript文件、一个css文件和上面的所有例子。

0
投稿

猜你喜欢

手机版 网络编程 asp之家 www.aspxhome.com