ホームページ > ウェブフロントエンド > jsチュートリアル > jQuery はプラグインを開発するための 2 つの方法を提供します

jQuery はプラグインを開発するための 2 つの方法を提供します

零下一度
リリース: 2017-07-23 14:59:56
オリジナル
1322 人が閲覧しました

jQuery にはプラグインを開発するための 2 つのメソッドが用意されています。つまり、

jQuery.fn.extend();

jQuery.extend();
ログイン後にコピー

jQuery.fn

jQuery.fn = jQuery.prototype = {init: function( selector, context ) {//….//……};
ログイン後にコピー

jQuery.fn = jQuery.prototype であることが分かります。
JavaScript にはクラスという明確な概念がありませんが、それを理解するにはクラスを使用する方が便利です。
jQuery は非常によくカプセル化されたクラスです。たとえば、ステートメント $(“#btn1”) を使用すると、jQuery クラスのインスタンスが生成されます。

jQuery.extend(object)

  • jQuery クラスにクラス メソッドを追加します。これは、静的メソッドを追加するものとして理解できます。例:

jQuery.extend({
min: function(a, b) { return a < b ? a : b; },
max: function(a, b) { return a > b ? a : b; }
});
jQuery.min(2,3); //  2 
jQuery.max(4,5); //  5
Objectj Query.extend( target, object1, [objectN])
ログイン後にコピー
  • 1 つまたは複数の他のオブジェクトでオブジェクトを拡張し、拡張されたオブジェクトを返す

var settings = { validate: false, limit: 5, name: "foo" }; 
var options = { validate: true, name: "bar" }; 
jQuery.extend(settings, options); //结果:settings == { validate: true, limit: 5, name: "bar" }
jQuery.fn.extend(object);
ログイン後にコピー

jQuery.prototype の拡張とは、jQuery クラスに「メンバー関数」を追加することです。 jQueryクラスのインスタンスはこの「メンバー関数」を利用することができます。
たとえば、特別な編集ボックスを作成するプラグインを開発したいとします。それがクリックされると、現在の編集ボックスの内容が警告されます。これを行うことができます:

$.fn.extend({          
    alertWhileClick:function() {            
          $(this).click(function(){                 
                 alert($(this).val());           
           });           
     }       
});       
$("#input1").alertWhileClick(); // 页面上为:    
$("#input1") //为一个jQuery实例,当它调用成员方法 alertWhileClick后,便实现了扩展,每次被点击时它会先弹出目前编辑里的内容。
ログイン後にコピー

jQuery.extend() の呼び出しは、メソッドをオブジェクトのインスタンスに拡張しません。また、それを参照するメソッドも、jQuery.init() などの jQuery クラスを通じて実装する必要があります。 extend() の呼び出しはメソッドをオブジェクトのプロトタイプに拡張するため、jQuery オブジェクトがインスタンス化されると、これらのメソッドが jQuery.js

のあらゆる場所に反映されます。
jQuery.fn.extend = jQuery.prototype.extend
ログイン後にコピー

オブジェクトを jQuery のプロトタイプに拡張できます。この場合、それはプラグインのメカニズムです。

りー

以上がjQuery はプラグインを開発するための 2 つの方法を提供しますの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート