以前一直都在用jquery,突然转到mootools,很多语法结构不太适应,不过没关系,我们可以给Mt加扩展让他的语法结构像jquery那样

这一点在Mt上实现起来并不难,可是如果要让jquery模仿Mt是没办法的.

Element.implement({
        //EVENTS
        bind:function(type,fn){//$('simple').bind('click mousewheel contextmenu',function(){alert('sh')}).alert('link');
            type.split(' ').each(function(event){
                this.addEvent(event,fn);
            },this);
            return this;
        },
        fire:function(type,args,tim){//$('b').fire('click',$('a'),4000);触发$('b')的事件
            return this.fireEvent(type,args,tim);
        },
        one:function(type,fn){//$('simple').one('click',function(){alert('sh')}).alert('link');
            var removeOne=function(){this.removeEvent(type,fn).removeEvent(type,removeOne);}
            return this.addEvent(type,fn).addEvent(type,removeOne);
        },
        hover:function(fn1,fn2){//$('simple').hover(function(){console.log('1')},function(){console.log('2')});
            return this.addEvents({
                'mouseenter':fn1,
                'mouseleave':fn2
            });
        },
        //METHOD
        data:function(opt,value){
            return value ? this.store(opt,value):this.retrieve(opt);
        },
        //ATTRIBUTES
        attr:function(prop,value){
            switch ($type(prop)){
                case 'object':
                    this.set(prop);
                    break;
                case 'string':
                    if(value){
                        //Note:first attempt() arg is supposed to be index of elements array,but can't be done in Mootools
                        if($type(value)=='function') value=value.attempt(this,this);
                        this.set(prop,value)
                    }
                    else return this.get(prop);
            }
            return this;
        },
        html:function(value){
            return value ? this.set('html',value):this.get('html');
        },
        text:function(text){
            return text ? this.set('text',text):this.get('text');
        },
        val:function(value){
            //Note:Array type value not implemented
            return value ? this.set('value',value):this.get('value');
        },
        alert:function(msg){
            alert(msg);
        },
        show:function(){
            this.setStyle('display','');
        },
        hide:function(){
            this.setStyle('display','none');
        },
        _show:function(){
            this.fade('in');
        },
        _hide:function(){
            this.fade('out');
        },
        toggle:function(event,fn,fn2){
            var flag=true;
            return this.addEvent(event,function(){
                (flag ? fn:fn2).apply(this,arguments);
                flag=!flag;
            });
        },
        xlight:function(linkClass,opacity){
            opacity=(opacity)?opacity:.3;
            linkClass=(linkClass.charAt(0)=='.')?linkClass:'.'+linkClass;
            this.addEvent('mouseover:relay('+linkClass+')',function(e,elem){
                $$(linkClass).each(function(link){
                    if(elem!=link){link.tween('opacity',opacity);}
                });
            });
            this.addEvent('mouseout:relay('+linkClass+')',function(e,elem){
                $$(linkClass).each(function(link){
                    link.tween('opacity',1);
                });
            });
        }
    });