web-dev-qa-db-ja.com

jQuery.extendとjQuery.fn.extendの違いは?

2つのプラグインを1つにマージするため、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);
        });
    },

this

$.fn.blink = function(options)
    {

first(=なし)は複数のメソッドを一度に設定する方法のように見えるためです。これは正解?また、私がここにいる間に、jqueryオブジェクトに要素とロジックを追加する理由は何ですか?

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

(これはタイマープラグインからです)

80
Richard

jQuery.extendは追加の関数を使用してオブジェクトを拡張するために使用されますが、jQuery.fn.extendはjQuery.fnオブジェクトを拡張するために使用されます。

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

使用法:$.abc()。 ($.ajax()のようなセレクターは不要です。)

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

使用法:$('.selector').xyz()。 ($('#button').click()のようなセレクタが必要です。)

主に、$.fn.each()の実装に使用されます。

役に立てば幸いです。

70
Dinesh

JQuery.extendとjQuery.fn.extendの違いは?

実際、それらの基本参照以外には何もありません。 jQuery source では、次のように読むことができます:

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

それでは、どのように機能しますか? ドキュメント 読み取り:

2つ以上のオブジェクトの内容を最初のオブジェクトにマージします。

これは、ネストされたオブジェクトを再帰するためのフラグを付けたプロパティをコピーするfor-in-loopです。そして別の機能:

$.extend()に引数が1つだけ指定されている場合、これはターゲット引数が省略されたことを意味します

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

したがって、関数が(明示的なターゲットなしで)jQuery自体で呼び出されると、jQuery名前空間が拡張されます。関数が_jQuery.fn_(明示的なターゲットなし)で呼び出された場合、すべての(プラグイン)メソッドが配置されているjQueryプロトタイプオブジェクトを拡張します。

19
Bergi

このブログ投稿 素敵な説明があります:

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

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

引用:

一般的なルールとして、関数のjQueryオブジェクトとメソッドのjQuery.fnオブジェクトを拡張する必要があります。メソッドとは対照的に、関数はDOMから直接アクセスされません。

16
gavenkoa
_$.fn.something= function{};
_

jQuery.prototypeを指し、「this」を介してdom要素にアクセスできます。これで$(selector).something();を使用できます。したがって、これは$(selector).css();のようなプラグイン関数として機能します。

_$.something = function{};
_

jQueryオブジェクト自体にプロパティまたは関数を追加し、domアクセスに「this」を使用することはできません。今ではuを$.something();これは$.trim()としてユーティリティ関数として機能します

しかし

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

複数の関数を同時に追加できます。また、複数のオブジェクトを提供する場合に、それらを使用して2つのオブジェクトリテラルをマージすることもできます。

9
Shishir Arora