jquery插件编写学习

1、(function($){})(jQuery),$(function(){})的区别

(function($){})(jQuery)其实是一个匿名函数的调用过程,其中function($){}是一个匿名函数,(jQuery)是调用的过程,前面的用()括起来是由于运算符优先级的问题,所以函数本身也需要()

2、$.extend({})、$.fn.extend({})和$.fn.函数名、$.fn

$.extend()是对JQuery的扩展,相当于JQuery的静态方法。

$.fn.extend()是对JQuery对象的扩展,相当于JQuery的事例对象方法。

$.fn.函数名功能与$.fn.extend()相同,不同在于$.fn.extend()可同时拓展多个方法而$.fn.函数名只能拓展一个即函数名。

$.fn功能与$.extend()相同,不同之处与$.fn.函数名同$.fn.extend()的区别相同。

3、一段Jquery插件代码

my.js:

// JavaScript Document
;
  var myMethod=function(options){
 this.init(options);
  }
  myMethod.prototype={
init:function(options){
  var option=$.extend(true,{
id:1,
name:'cuixuefeng'
  },options);
  this.option=option;
  },
  call:function(){
  alert(this.option.id+this.option.name);
  },
  };
myMethod.doudou=function(){
alert(21);
};
(function($){
  //插件入口
  $.fn.myMethod=function(options){
  return new myMethod(options);
 }
  //$.fn.extend({
//myMethod:function(options){
  //return new myMethod(options);
 //}
  //})
})(jQuery);

html:

<head>

<script type="text/javascript" src="js/jquery-1.8.2.min.js"></script>

<script type="text/javascript" src="js/my.js" ></script>
</head>
<body>
hehe
<script>
$(function(){
myMethod.doudou();
var ss=$.myMethod({
id:2,
name:"douniwan"
}).call();
});
</script>
</body>

猜你喜欢

转载自blog.csdn.net/cuixuefeng1112/article/details/50774276