jquery插件编写超精简版

根据《jQuery高级编程》的描述，jQuery插件开发方式主要有三种：

通过$.extend()来扩展jQuery，添加的是静态方法，用得不多。
通过$.fn 向jQuery添加新的方法，常用方法，下面要介绍的写法。
通过$.widget()应用jQuery UI的部件工厂方式创建，用得不多。

;(function($, window, document,undefined) {
    //定义Beautifier的构造函数
    var Beautifier = function(ele, opt) {
        this.$element = ele,
        this.defaults = {
            'color': 'red',
            'fontSize': '12px',
            'textDecoration': 'none'
        },
        this.options = $.extend({}, this.defaults, opt)
    }
    //定义Beautifier的方法
    Beautifier.prototype = {
        beautify: function() {
            return this.$element.css({
                'color': this.options.color,
                'fontSize': this.options.fontSize,
                'textDecoration': this.options.textDecoration
            });
        }
    }
    //在插件中使用Beautifier对象
    $.fn.myPlugin = function(options) {
        //创建Beautifier的实体
        var beautifier = new Beautifier(this, options);
        //调用其方法
        return beautifier.beautify();
    }
})(jQuery, window, document);

调用

$(function() {
    $('a').myPlugin({
        'color': '#2C9929',
        'fontSize': '20px',
        'textDecoration': 'underline'
    });
})

注释

1. ; 用来防止上一行没有用 ; 结尾导致程序无法执行
2. (function( ){ })( );自调用匿名函数用来避免污染全局作用域
3. jQuery, window, document将系统变量以参数形式传递到插件内部window等系统变量在插件内部就有了一个局部的引用，可以提高访问速度，会有些许性能的提升
4. undefined我们并没有传递这个参数，但却在接收时接收了它，因为实际并没有传，所以‘undefined’那个位置接收到的就是真实的'undefined'了
5. 使用面向对象的方法进行插件开发，使得代码易维护和扩展
6. $.extend方法用来合并用户配置和默认配置，参数中使用{}空对象是为了避免修改默认defaults配置在插件中的值
7. 最后用return返回起到插件链式调用的作用