jQuery插件-提供API

Question

我目前正在开发一个相当复杂的jQuery插件。我正在设计的是可扩展的。我遇到的难题是如何准确地向我的用户提供他们可以使用的API。

我可以想出两种方法：

1. 通过全局范围中的一个对象提供API。

这是我目前使用的方法。我的做法与此类似：

(函数($，win，未定义){//主插件功能函数pluginStuff() { /*...including方法调用逻辑.*}//寄存器函数与jQuery $.fn.extend({ Plugin: pluginStuff })；//寄存器全局API变量win.PluginAPI ={ extendMe：{}，getVar: function() {} }；}(jQuery，窗口)；

不幸的是，由于我采用了标准的others.

• Provide体系结构，所以不得不通过放置在jQuery中的对象使用jQuery方法和API变量，这有点奇怪。

我也玩过这个方法，但是它的最佳实践是只占用jQueries fn作用域中的一个槽，而不是拥挤jQuery变量。在这个方法中，我会将我的api变量放在$.fn中而不是window中：

// jQuery $.fn.extend寄存器函数({ Plugin: pluginStuff })；//寄存器全局API变量$.fn.PluginAPI ={ extendMe：{}，getVar: function() { }；

我宁愿不打破这个惯例，占据两个位置。

现在我写了这篇文章，我可以看到第三个选项，在jQuery的fn作用域中，我将插件槽指定为一个对象：

$.fn.Plugin = { plugin: pluginStuff, api: { extendMe: {}, getVar: function() {} } };

但是，如果用户不得不做$('#elm').Plugin.plugin({ setting: 'value' })来创建插件的新实例，这会得到多大的反响呢？

任何帮助或指示都将不胜感激。

请注意：，我不是在寻找将API对象合并到插件功能中的方法。我正在寻找一种方法来保持它单独模块化，但直观地可以使用/扩展。

Answer 1

我最终决定使用的方法是在fn命名空间下注册插件，在jQuery $命名空间下注册api变量。因为方法和选项集对插件实例进行操作，所以$.fn是最好的选择。

但是，API是全局的，不链接到单个实例。在这种情况下，$.fn不太适合。我最后使用的是类似于以下内容的内容：

(function ($, win, undefined) {
    //main plugin functionality
    function pluginStuff() { /*...including method calling logic...*/ }

    //register function with jQuery
    $.fn.Plugin = pluginStuff;

    //register global API variable
    $.Plugin = { extendMe: {}, getVar: function() {} };
})(jQuery, window);

现在您可以像预期的那样创建一个使用插件对象：

$('#elm').Plugin();
$('#elm').Plugin('option', 'something', 'value');
$('#elm').Plugin('method');

您可以轻松地扩展和访问API：

$.extend($.Plugin.extendMe, {
    moreStuff: {}
});
$.Plugin.getVar('var');

谢谢大家的帮助！

Answer 2

你总是可以像这样

var plugin = function plugin() { /* do the main stuff */ };
// api stuff here
plugin.getVar = function() { };
plugin.extendMe = {};

$.fn.Plugin = plugin;

或者将额外的内容放入指定给plugin.api的对象中。

但是，不管你怎么做，你都得担心一些设置会流到对方身上。由于一切都将使用相同的函数，无论您选择如何设置它，您都需要一种方法来保持对插件的调用彼此分离。例如，也许可以使用this.selector (在插件函数中)作为属性关联数组的键。我通常建议.data()将设置附加到单个元素，但如果相同的元素被调用了两次，那就没有多大帮助了。