86

我正在尝试了解 jquery 插件语法，因为我想将两个插件合并为一个。还需要能够停止间隔或运行多次的信号灯。

无论如何，这种语法是否与

jQuery.fn.extend({
    everyTime: function(interval, label, fn, times) {
        return this.each(function() {
            jQuery.timer.add(this, interval, label, fn, times);
        });
    },
    oneTime: function(interval, label, fn) {
        return this.each(function() {
            jQuery.timer.add(this, interval, label, fn, 1);
        });
    },

这

$.fn.blink = function(options)
    {

因为看起来第一个（没有=）是一次设置多个方法的方法。这是正确的吗？另外，当我在这里时，将元素和一些逻辑添加到 jquery 对象的原因是什么？

jQuery.extend({
    timer: {
        global: [],
        guid: 1,
        dataKey: "jQuery.timer",

（这是来自计时器插件）

4

5 回答 5

93

jQuery.extend 用于扩展任何具有附加功能的对象，但 jQuery.fn.extend 用于扩展 jQuery.fn 对象，实际上是一次性添加了几个插件功能（而不是单独分配每个功能）。

jQuery . 扩展：

var obj = { x: function() {} }

jQuery.extend(obj, { y: function() {} });

// now obj is an object with functions x and y

jQuery.fn.extend：

jQuery.fn.extend( {
        x: function() {},
        y: function() {}
});

// creates 2 plugin functions (x and y)
于 2010-01-02T09:53:15.680 回答
78 
jQuery.extend({
    abc: function(){
        alert('abc');
    }
});

用法：$.abc()。（不需要选择器，例如$.ajax()。）

jQuery.fn.extend({
    xyz: function(){
        alert('xyz');
    }
});

用法：$('.selector').xyz()。（需要选择器，例如$('#button').click()。）

主要是用来实现的$.fn.each()。

我希望它有所帮助。

于 2012-12-21T14:54:22.913 回答
21

jQuery.extend 和 jQuery.fn.extend 的区别？

实际上，除了它们的基本参考之外，没有其他的。在jQuery 源代码中，您可以阅读：

jQuery.extend = jQuery.fn.extend = function() { … };

那么它是怎样工作的？文档内容如下：

将两个或多个对象的内容合并到第一个对象中。

它只是一个复制属性的 for-in-loop，用一个标志来递归嵌套对象。还有一个特点：

如果只提供一个参数$.extend()，这意味着目标参数被省略

 // then the following will happen:
 target = this;

因此，如果函数本身被调用jQuery（没有明确的目标），它将扩展 jQuery 命名空间。如果函数被调用jQuery.fn（没有明确的目标），它将扩展所有（插件）方法所在的jQuery原型对象。

于 2013-02-11T20:04:05.517 回答
15

这篇博文有很好的描述：

$.fn.extend({
myMethod: function(){...}
});
//jQuery("div").myMethod();

$.extend({
myMethod2: function(){...}
});
//jQuery.myMethod2();

引号：

作为一般规则，您应该为函数扩展 jQuery 对象，为方法扩展 jQuery.fn 对象。与方法相反，函数不能直接从 DOM 访问。

于 2013-03-13T12:10:31.463 回答
10 
$.fn.something= function{};

指向 jQuery.prototype 并允许通过“this”访问 dom 元素。现在你可以使用$(selector).something();所以这就像插件功能一样$(selector).css();

$.something = function{};

向 jQuery 对象本身添加一个属性或函数，你不能使用“this”来访问 dom 现在你可以将它用作$.something()；这作为一个效用函数$.trim()

但

$.fn.extend({function1(), function2()}) and  $.extend({function1(), function2()})

允许同时添加多个函数。如果我们提供多个对象，它们也可用于合并两个对象字面量。

于 2014-03-07T23:12:23.657 回答