就我目前所知，編寫jQuery擴充套件（外掛）有三種方式

• 擴充套件jQuery本身的方法，$.extend
• 擴充套件jQuery物件的方法，$.fn.extend
• 擴充套件DataType物件的方法，[DataType].prototype，[DataType]代指String、Number...等資料型別

下面通過舉例介紹具體用法

1.$.extend，以一個頁面彈窗為例：

//$.extend有兩種寫法，注意擴充套件時funcName=function()和funcName:function()的區別

//1. $.funcName = function(){}，一般用於定義單個擴充套件（外掛）
 

$.popUp = function (text, type, second = 2) {
    var types = {
        'info': {'background': "#90c24f"},
        'warning': {'background': "#f99e2b"},
        'error': {'background': "#f06a6a"}
    }
    type = type in types ? type : 'info'
    $p = $('<p></p>').text('{0}：{1}'.format(type, text)).css({ 
    //format方法也是擴充套件（外掛），詳見下文[DataType].prototype
 

        'color': 'white',
        'width': '400px',
        'z-index': '5',
        'height': '50px',
        'line-height': '50px',
        'text-align': 'center',
        'position': 'fixed',
        'top': '50px',
        'left': '50%',
        'margin': '3px',
        'margin-left': '-200px',
        'border-radius'
 
: '5px'
    }).css(types[type]);
    $('body').append($p);
    setTimeout(() => $p.fadeOut(), parseInt(second) * 1000)
};

 //2. $.extend({funcName1:function(){}, funcName2:function(){}})，一般用於定義多個擴充套件（外掛）
 $.extend({
    popUp: function (text, type, second = 2) {
        ...
    },
});

//呼叫方式：
$.popUp("儲存失敗！", "error", 3)

2.$.fn.extend，以一個在游標處插入文字為例：

//和$.extend一樣，$.fn.extend也是同樣的兩種寫法

//1. $.fn.funcName = function(){}，一般用於定義單個擴充套件（外掛）
$.fn.insertContent = function (myValue, t) {
    var $t = $(this)[0];
    if (document.selection) { // ie
        this.focus();
        var sel = document.selection.createRange();
        sel.text = myValue;
        this.focus();
        sel.moveStart('character', -l);
        var wee = sel.text.length;
        if (arguments.length == 2) {
            var l = $t.value.length;
            sel.moveEnd("character", wee + t);
            t <= 0 ? sel.moveStart("character", wee - 2 * t - myValue.length) : sel.moveStart("character", wee - t - myValue.length);
            sel.select();
        }
    } else if ($t.selectionStart
        || $t.selectionStart == '0') {
        var startPos = $t.selectionStart;
        var endPos = $t.selectionEnd;
        var scrollTop = $t.scrollTop;
        $t.value = $t.value.substring(0, startPos)
            + myValue
            + $t.value.substring(endPos, $t.value.length);
        this.focus();
        $t.selectionStart = startPos + myValue.length;
        $t.selectionEnd = startPos + myValue.length;
        $t.scrollTop = scrollTop;
        if (arguments.length == 2) {
            $t.setSelectionRange(startPos - t,
                $t.selectionEnd + t);
            this.focus();
        }
    } else {
        this.value += myValue;
        this.focus();
    }
}

//2. $.fn.extend({funcName1:function(){}, funcName2:function(){}})，一般用於定義多個擴充套件（外掛）
$.fn.extend({
    insertContent: function (myValue, t) {
        ...
    },
})

//呼叫方式
$("#target").insertContent("text");

3.[DataType].prototype，以一個文字格式化為例：

//[DataType].prototype只有一種寫法
String.prototype.format = function (args) {
    var result = this;
    if (arguments.length > 0) {
        if (arguments.length == 1 && typeof (args) == "object") {
            for (var key in args) {
                if (args[key] != undefined) {
                    // noinspection Annotator
                    var reg = new RegExp("({" + key + "})", "g");
                    result = result.replace(reg, args[key]);
                }
            }
        }
        else {
            for (var i = 0; i < arguments.length; i++) {
                if (arguments[i] != undefined) {
                    // noinspection Annotator
                    var reg = new RegExp("({[" + i + "]})", "g");
                    result = result.replace(reg, arguments[i]);
                }
            }
        }
    }
    return result;
}

//呼叫方式
var text = '{"{0}": {1}, "{2}": "{3}"}'.format('id',1,'name','nandy')