jQuery插件实现的方法和原理简单说明

下文来自 http://www.itzhai.com/jquery-plug-ins-to-achieve-the-methods-and-principles-of-simple-instructions.html

jQuery插件实现的方法和原理简单说明

jQuery是一个封装的很好的类，比如我们使用$("#username")会生成一个 jQuery类的实例。

1、jQuery插件开发主要使用如下两个方法：

1.1、添加静态方法

jQuery.extend(object);

为扩展jQuery类本身，为类添加新的方法，可以理解文添加静态方法。

$.extend({
　　addMethod : function(a, b){return a + b;}   // $.addMethod(1, 2); //return 3
});

1.2、添加成员方法

jQuery.fn.extend(object);

jQuery.fn = jQuery.prototype

给jQuery对象添加方法，对jQuery.prototype进行扩展，为jQuery类添加成员方法：

$.fn.extend({
    getInputText:function(){
        $(this).click(function(){
            alert($(this).val());
        });
    }
});
 
$("#username").getInputText();

2、一个通用的框架：

以下是一个通用的框架：

(function($){
    $.fn.yourPluginName = function(options){
        //各种属性和参数 
 
        var options = $.extend(defaults, options); 
 
        this.each(function(){
            //插件的实现代码
 
        });
    };
})(jQuery);

关于

$.extend(defaults, options);

就是通过合并defaults和options来扩展defaults，实现插件默认参数的功能，详细解释可以参考jQuery的官方文档：

http://api.jquery.com/jQuery.extend/