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;

  }