目录：

1.基本JQ扩展插件js的格式

2.对JQ选中元素的方法的扩展，调用类似于$("selector").myMethod(),这里的myMethod是自己扩展的方法，与.click()同理

3.对JQ自身的方法扩展，调用类似于$.ajax();

 

一、基本JQ扩展插件的格式

一个扩展插件的格式一般是：

(function($){.........})(jQuery);当然，为了防止压缩合并等操作时，它前面的js代码没有结束分号而引起错误，这里可以在前面加个;就是：;(function($){.........})(jQuery);传入参数可以有多个，比如：;(function($, window,document,undefined){.........})(jQuery,window, document);

引用这种写法的插件时，务必要在引入jquery本身之后，再引入插件。

 

二、对JQ选中元素的方法的扩展，调用类似于$("selector").myMethod()

 

类似于.click(),.show()这种调用方式的方法。。属于对jQuery.fn的扩展，所以，扩展自己的方法，这样写：

$.fn.extend({    myMethod: function () {    //用this可以拿到调用该方法的jq dom元素    //do your work    }  });

 或者：

$.fn.myMethod = function(){    //用this可以拿到调用该方法的jq dom元素    //do your work  }; $("#dd").click();

 例如：

封装一个方法：alertWhileClick，点击input时控制台打印出当前input输入框的内容

$.fn.alertWhileClick = function(){        $(this).click(function () {          console.log($(this).val());        });

调用：

$("#demo1Input").alertWhileClick();

试一下：

二、对JQ自身的扩展，调用如$.ajax()

$.extend({    myMethod: function (param1, param2....需要传入的参数) {      //do your work    }  });

 

例如扩展一个得到最大最小值的方法：

$.extend({    min: function (a, b) {      //do your work      return a < b ? a : b;    },    max: function (a, b) {      return a > b ? a : b;    }  });

调用如下：

var result = $.max(10,20);//得到10和20中最大的树