js模仿jquery的写法示例代码

测试代码:

代码如下:

(function(){ 
var p=new PEvent(document); 
p.click(function() { 
//alert("单击"); 
//alert(p.style); 
var html=""; 
for ( var item in document) { 
html+=item+':'+document[item]+"\r\n"; 
} 
//alert(html); 
}); 
p.dblclick(function() { 
alert("双击"); 
}); 
p.contextmenu(function(event) { 
try{ 
var x=event.clientX; 
var y=event.clientY; 
var menu=g("menu"); 

//判断坐标 
var width=document.body.clientWidth; 
var height=document.body.clientHeight; 
x=(x+menu.clientWidth)>=width?width-menu.clientWidth:x; 
y=(y+menu.clientHeight)>=height?height-menu.clientHeight:y; 

//alert("可视高度:"+height+",鼠标高度:"+y); 
menu.style.top=y+"px"; 
menu.style.left=x+"px"; 
menu.style.display="block"; 

}catch(e){ 
alert(e); 
} 
return false; 
}); 
function PEvent(dom){ 

this.x=function() { 
this.style.css=dom.style; 
} 

this.click=function(fn){ 
dom.onclick=fn; 
this.x(); 
} 

this.dblclick=function(fn){ 
dom.ondblclick=fn; 
} 

this.contextmenu=function(fn){ 
dom.oncontextmenu=fn; 
} 

this.style=new Po(); 

}; 

function Po() { 
this.name=new Object(); 
this.id=new Object(); 
this.css=new Object(); 
} 
})(); 
function g(id){ 
return document.getElementById(id); 
}

在jquery中,处理事件的时候,都可以匿名方法来写,例如:

代码如下:

obj.click(function(){ 
alert("hello"); 
});

上诉这种形式。
在方法传递参数的时候,可以传递fun 方法。
调用呢,就可以这样调用:

代码如下:

this.dblclick=function(fn){ 
dom.ondblclick=fn; 
}

相关推荐