扩展和 jQuery.fn.tended 之间的区别?

我试图理解 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",

(这是从计时器插件)

64606 次浏览

jQuery.extend is used to extend any object with additional functions, but jQuery.fn.extend is used to extend the jQuery.fn object, which in fact adds several plugin functions in one go (instead of assigning each function separately).

jQuery.extend:

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)
jQuery.extend({
abc: function(){
alert('abc');
}
});

usage: $.abc(). (No selector required like $.ajax().)

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

usage: $('.selector').xyz(). (Selector required like $('#button').click().)

Mainly it is used to implement $.fn.each().

I hope it helps.

Difference between jQuery.extend and jQuery.fn.extend?

Actually, there is none apart from their base reference. In the jQuery source, you can read:

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

So how does it work? The documentation reads:

Merges the contents of two or more objects together into the first object.

It's just a for-in-loop that copies properties, pimped up with a flag to recurse nested objects. And another feature:

If only one argument is supplied to $.extend(), this means the target argument was omitted

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

So if the function is called on jQuery itself (without explicit target), it will extend the jQuery namespace. And if the function is called on jQuery.fn (without explicit target), it will extend the jQuery prototype object where all the (plugin) methods are located.

This blog post have nice description:

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


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

Quotes:

As a general rule, you should extend the jQuery object for functions and the jQuery.fn object for methods. A function, as opposed to a method, is not accessed directly from the DOM.

$.fn.something= function{};

points to the jQuery.prototype and lets access dom elements through "this". Now u may use $(selector).something(); So this works as plugin function like $(selector).css();

$.something = function{};

adds a property or function to the jQuery object itself and u cannot use "this" for dom access Now u may use it as $.something(); this works as a utility function as $.trim()

but

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

allows adding more than 1 function at the same time.Also they can be used to merge two object literals in case we provide more than one objects.