让Mootools的语法结构像Jquery那样
以前一直都在用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);
});
});
}
});
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 如何编写易于单元测试的代码
· 10年+ .NET Coder 心语,封装的思维:从隐藏、稳定开始理解其本质意义
· .NET Core 中如何实现缓存的预热?
· 从 HTTP 原因短语缺失研究 HTTP/2 和 HTTP/3 的设计差异
· AI与.NET技术实操系列:向量存储与相似性搜索在 .NET 中的实现
· 10年+ .NET Coder 心语 ── 封装的思维:从隐藏、稳定开始理解其本质意义
· 地球OL攻略 —— 某应届生求职总结
· 提示词工程——AI应用必不可少的技术
· Open-Sora 2.0 重磅开源!
· 周边上新:园子的第一款马克杯温暖上架