mootools【一】- 起步篇
以前一直在用prototype.js,最近发现了mootools,据说也相当不错,它是个纯OO的javascript 框架,所以拿来学习学习,把学习经过记录下来。
粗略看了下,mootools很貌似prototype,所以用过prototype框架的人应该很容易上手的。
mootools提供的功能高度模块化,可以根据实际需要来裁剪。
它的核心库是Moo.js和Utility.js,Moo.js里包含了实现OO的基础类,Utility.js提供了最常用的工具函数的封装。
---------------------------Moo.js-------------------------------------
prototype.js里提供了如下形式来创建我们的对象:
var Cat = Class.create();
Person.prototype = {
initialize: function(name){
this.name = name;
}
};
var cat = new Cat ('kitty');
alert(cat.name);
对应,mootools使用如下形式:
var Cat = new Class({
initialize: function(name){
this.name = name;
}
});
var cat = new Cat ('kitty');
alert(cat.name);
恩,两者看起来很像,不过,好像mootools这种方式更加符合OO的习惯(不过也要看各人喜欢的啦)。
Class进行继承,mootools是这样做的:
var Animal = new Class({
initialize: function(name){
this.name = name;
}
});
var Cat = Animal.extend({
initialize: function(name,age){
this.parent(name); //调用Animal的initialize方法
this.age = age;
}
});
是的,相当好用。
Class.implement方法从功能上来理解是对已经定义好的类进行扩展,用法如下:
var Person = new Class({
initialize: function(name){
this.name = name;
}
});
Person.implement({
initialize: function(name,age){
this.name = name;
this.age = age;
},
myAction: function(){
alert(this.name+'--'+this.age);
}
});
var p = new Person('zarknight',24);
p.myAction();
这和java中的实现接口好像不是一个概念...
mootools对Object扩展了一个extend方法,它有两个参数,作用是复制第二个参数对象的所有属性到第一参数对象中去,同名属性将覆盖为第二个参数中的相应属性:
var firstOb = {
'name': 'John',
'lastName': 'Doe'
};
var secondOb = {
'age': '20',
'sex': 'male',
'lastName': 'Dorian'
};
Object.extend(firstOb, secondOb);
//firstOb将变成:
{
'name': 'John',
'lastName': 'Dorian',
'age': '20',
'sex': 'male'
};
---------------------------Moo.js-------------------------------------
$type
作用:基本上是对typeof的扩展,返回输入参数的类型
例子:
var x = $type("abcdefg");
返回值:
'element' - DOM
'textnode' - DOM 文本节点
'whitespace' - DOM 空白节点
'array' - 数组
'object' - 对象
'string' - 字符串
'number' - 数字
'boolean' - 布尔型
'function' - 函数
false - 如果是未定义或则不是以上列出的类型
$chk
作用:如果输入参数是数值(包括0)或是对象(不为null或undefined),则返回true,否则返回false
var x = $chk("abcde"); //true
var y = $chk(0); //true
var z = $(null); //false
$pick
作用:如果第一个参数对象存在,则返回这个对象;否则返回第二个参数对象
var x = $pick("openfdc","zarknight"); //openfdc
var y = $pick(null,"zarknight"); //zarknight
var z = $pick(1, 2); //1
$random
作用:产生一个介于(包括)指定的最大范围值和最小范围值之间的随机整数
var x = $random(1,100); //产生一个1~100之间的随机整数
$clear
作用:其实就是clearTimeout和clearInterval都调用一遍
var timer1 = setInterval("abc()",1000);
timer1 = $clear(timer1);
var timer2 = aFunc.delay(1000); //delay是mootools对Function的扩展,具体用法看mootools文档或我的后文...
timer2 = $clear(timer2);
另外,mootools往window对象里摆了这么些属性,用来作为检测浏览器类型的工具:
window.ie<
分享到:
相关推荐
MooTools是一个简洁,模块化,面向对象的JavaScript框架。它能够帮助你更快,更简单地编写可扩展和兼容性强的JavaScript代码。Mootools从Prototype.js中汲取了许多有益的设计理念,语法也和其极其类似。但它提供的...
比prototypejs更丰富、更强大的mootools.js插件 1.4.5 core下载。mootools.js可以生成较为复杂的、动态的网页交互效果,和jquery一样强大。。Mootools从Prototype.js中汲取了许多有益的设计理念,语法也和其极其类似...
mootools插件 1.5.1 最新版下载,目前,mootools插件的最新版本是1.5.1,这个插件实现的功能不亚于jquery,是一款同样优秀的js插件,为了大家方便,在此与大家分享,因为觉得官网下载的速度好慢啊,而且很多时候都是...
MooTools是一个简洁,模块化,面向对象的JavaScript框架。它能够帮助你更快,更简单地编写可扩展和兼容性强的 JavaScript代码。Mootools从Prototype.js中汲取了许多有益的设计理念,语法也和其极其类似。但它提供的...
官方网站:www.mootools.net文档翻译:zarknightMooTools是一个简洁...总之,Mootools是一个非常优秀的Javascript框架,更多精髓部分等待你去发掘,希望你也能通过学习和使用而喜欢上Mootools,甚至喜欢上Javascript :)
mootools框架入门教程mootools框架入门教程mootools框架入门教程
MooTools是一个简洁,模块化,面向对象的开源JavaScript web应用框架。它为web开发者提供了一个跨浏览器js解决方案。在处理js css html时候。它提供了一个比普通js更面向对象的document API。优点::1.灵活,模块化...
MooTools1.4中文PDF手册+MooTools-Core-1.5.1.js
MooTools 帮助文档 api ajax
Mootools v1.11 文档 pdf html Mootools v1.2.1 js
MooTools是一个简洁,模块化,面向对象的JavaScript框架。它能够帮助你更快,更简单地编写可扩展和兼容性强的JavaScript代码。Mootools从Prototype.js中汲取了许多有益的设计理念,语法也和其极其类似。但它提供的...
mootools1.1.js
Joomla 自带JS库 Mootools API,推荐给Joomla爱好者
mootools已经更新到了1.2版本 不过网上很多的手册多是1.1版本的 在1.2版本对于1.1版本有很多改变 所以对于想要学习和手头上还没有MOOTOOLS API的朋友 1.1版本已经不适合了 这个资源是MOOTOOLS 1.2 中文版手册 绝对...
基于mootools的tree和table控件
mootools相关chm,小动画gif教程。网上收集的资料。.
mootools之div层拖动学习的好资料 mootools之div层拖动
mootools,Javascript只能提示工具所必须的js文件
Mootools 1.2 CHM手册