Jquery插件的几种写法

349 阅读1分钟

Jquery插件的开发方式有以下几种:

1.通过$.extend()来扩展jQuery

$.extend({
    sayName: function(name) {
        console.log('My name is' + (name ? name : 'dd'));
    }
})
$.sayHello('haha'); //My name is haha

2.通过$.fn 向jQuery添加新的方法

$.fn.pluginName = function(options) {
	var defaults = {color: 'red', background: 'yellow' };
    var getOptions = $.extend(defaults, options);
    return getOptions;
}
$('a').pluginName({
    'color': '#2C9929',backgroud:'green'
});

3.通过$.widget()应用jQuery UI的部件工厂方式创建

通过部件库(Widget Factory)创建小部件是通过向 $.widget() 传递小部件名称和一个原型对象来完成的。下面的实例是在 "custom" 命名空间中创建一个 "superDialog" 小部件。

$.widget( "custom.superDialog", $.ui.dialog, {
    red: function() {
        this.element.css( "color", "red" );
    }
});
$( "<div>I am red</div>" )
    .superDialog( "red" );