一周学会Mootools 壹.四华语教程:(二)函数

set,setProperty:用来赋值,看例子:

好了,大家今日的教程是函数,在明日的课程中自身会把mt平时使用的局地函数讲解给我们:

示例:
    var myFirstElement =new Element('div#first');
    var mySecondElement=new Element('p#second');
    var myThirdElement =new Element('ul#third');
    var myFourthElement=new Element('a#fourth');
    var myParentElement=new Element('div#parent');
    myFirstElement.adopt(mySecondElement);
    mySecondElement.adopt('third',myFourthElement);
    myThirdElement.adopt([myFirstElement,new Element('span#another')]);

    结果:
    <div id="parent">
        <p id="second">
            <ul id="third"></ul>
            <a id="fourth"></a>
        </p>

    </div>

  透过对上一节课的上学,相信大家对mt的采取器应该有了一定的认识了,作者再放多少个小示例让大家对选用器的繁杂应用具有精晓:

delay://延时执行

getSize://获得大幅和中度,看例子

其余有关Mootools 一.四的作品:
自笔者写的Lightbox效果插件,基于MooTools
1.四

本人写的万年历插件(含奇门遁甲,阴历,农历,节气,种种节日等),基于MooTools
1.四

本身写的类似本站首页左上角的菜单的法力插件,基于MooTools
壹.四

Mootools中delay这一个延迟函数的尖端用法
Mootools中运用bind给函数绑定对象
Mootools中使用extend和implement给您的函数扩充成效或格局
温馨写个扩充把Mootools的语法改的和Jquery的语法一模一样
Mootools壹.四中自定义事件
用Mootools1.肆写了八个随着鼠标移动而背景图也随着移动的东西

typeOf://重回类型
    重回的种类:
    ‘element’ – (string) 单个节点
    ‘elements’ – (string) 八个节点
    ‘textnode’ – (string) 文本节点
    ‘whitespace’ – (string) If object is a DOM whitespace node.
    ‘arguments’ – (string) If object is an arguments object.
    ‘array’ – (string) If object is an array.
    ‘object’ – (string) If object is an object.
    ‘string’ – (string) If object is a string.
    ‘number’ – (string) If object is a number.
    ‘date’ – (string) If object is a date.
    ‘boolean’ – (string) If object is a boolean.
    ‘function’ – (string) If object is a function.
    ‘regexp’ – (string) If object is a regular expression.
    ‘class’ – (string) If object is a Class (created with new Class or
the extend of another class).
    ‘collection’ – (string) If object is a native HTML elements
collection,such as childNodes or getElementsByTagName.
    ‘window’ – (string) If object is the window object.
    ‘document’ – (string) If object is the document object.
    ‘domevent’ – (string) If object is an event.
    ‘null’ – (string) If object is undefined,null,NaN or none of the
above.

温故:

getPosition,setPosition://重临或安装偏移值,看例子

store,retrieve://向成分存款和储蓄区存放或读取值(与jq的data类似)

$('a').store('someProperty',someValue);
$('a').retrieve('someProperty');//returns someValue
    'AFD'.toLowerCase();
    'ffdsa'.toUpperCase();
 _cut:function(el){//把Element剪切并粘贴到el内部所有内容之前,父子
        return this.inject($(el),'top');//$('t1')._cut($('t3'));
    },
    cut_:function(el){//把Element剪切并粘贴到el内部所有内容之后,父子
        return this.inject($(el));//$('t1').cut_($('t3'));
    },
    _move:function(el){//把el平移到Element之前,兄弟
        return el.inject(this,'before');//$('t1')._move($('t3'));
    },
    move_:function(el){//把el平移到Element之后,兄弟
        return el.inject(this,'after');//$('t1')._move($('t3'));
    },
    _xmove:function(el){//把Element平移到el之前,兄弟
        return this.inject($(el),'before');//$('t1')._xmove($('t3'));
    },
    xmove_:function(el){//把Element平移到el之后,兄弟
        return this.inject($(el),'after');//$('t1').xmove_($('t3'));
    },

destroy://删除成分自己及全数子节点,然后内部存储器清理

连带课程:
三十一日学会Mootools
1.四华语教程:序论

13日学会Mootools
一.4普通话教程:(1)Dom选拔器

210日学会Mootools
壹.肆粤语教程:(二)函数

一周学会Mootools
一.四国语教程:(叁)事件

一周学会Mootools
1.肆华语教程:(4)类型

1日学会Mootools
一.四中文教程:(5)Ajax

七日学会Mootools
①.4粤语教程:(陆)动画

一周学会Mootools
壹.4国语教程:(七)汇总收尾

$('a').setStyle('display','none');
alert($('a').getStyle('display'));

setStyle,getStyle://设置或取得css样式,看例子

hasClass,addClass,removeClass,toggleClass://判断是不是有某样式,新增样式,移除样式,沟通样式,看例子

$('a').getPosition();//returns{x:100,y:500};
$('a').setPosition({x:10,y:100});

延伸:
  作者上边所教学的这个函数都以我们在普通开销中最日常使用的局地,当然了mt还有这三个函数,我们要是感兴趣能够看一下相当作者在率先学时为大家提供下载的材质文件,里边同时列出了任何壹些不常用的函数.

toLowerCase,toUpperCase://转为小写,转为大写

 

$('div').destroy();
    '4em'.toInt();//returns 4
    '10px'.toInt();//returns 10
    '95.25%'.toFloat();//returns 95.25
    '10.848'.toFloat();//returns 10.848

trim://去除两端空格

$('a').get('value');
$('a').getProperty('class');
    alert(' 啊 '.trim());
    示例:
    var myString='hello';
    alert(typeOf(myString));
var size=$('a').getSize();
alert(size.x+'|'+size.y);

get,getProperty:用来取值,看例子:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8">
<script style="text/javascript" src="https://ajax.googleapis.com/ajax/libs/mootools/1.4.1/mootools-yui-compressed.js"></script>
</head>

<body id='a'>
    <h2 class='a'>Single images</h2>
    <p>
    <a class='b' title="T1" href="http://www.digitalia.be.jpg"><img src="img/map1.png"></a>
    <a class='c' title="B1" href="http://www.digitalia.be.jpg"><img src="img/map2.png"></a>
    <a class='d' href="#"><img src="img/map2.png"></a>
    </p>
<script type='text/javascript'>
    alert($$('*').get('html'));//显示当前文件的html源码
    alert($$('.b','.c').get('title'));//同时选择多个节点
    alert($$('a[title=B1]').get('href'));//title='B1'的a节点
    alert($$('[href^=http]').get('href'));//href以http开头的节点
    alert($$('p > a').get('href'));//p下的a节点
    alert($$('a:not(.c)').get('href'));//class不等于c的a节点
    alert($$('a:index(0)').get('href'));//索引是0的a节点
    alert($$("a[title][href$=jpg]").get('href'));//包含title属性,且href属性以jpg三个字母结尾的a节点
</script>
</body>
</html>

inject://向成分钦定地方插入

alert($('a').hasClass('abc'));
$('a').addClass('abc');
$('a').removeClass('abc');
$('a').toggleClass:('bc');
$('a').set('value','123');
$('a').setProperty('class','abc');
    Function.attempt(
        function(){
            alert('a');
        },
        function(){
            alert('b');
        },
        function(){
            alert('c');
        }
    );

toInt,toFloat://转为整数,转为小数

adopt://向成分内部插入子成分

    function LoadCook(){
        clearTimeout(timer);
        alert('a');
    }var timer=LoadCook.delay(2000);

attempt://类似try

相关文章