86

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);
        });
    },

これ

$.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.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)
于 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() { … };

それで、それはどのように機能しますか？ドキュメントには次のように書かれています。

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

プロパティをコピーする for-in-loop にすぎず、ネストされたオブジェクトを再帰するためのフラグが追加されています。そして別の機能：

に引数が 1 つしか指定されていない場合$.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オブジェクト自体にプロパティまたは関数を追加し、domアクセスに「this」を使用できません。これで、として使用できます$.something()。これはユーティリティ関数として機能します$.trim()

しかし

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

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

于 2014-03-07T23:12:23.657 に答える