Jqueryプラグインの書き方メモcompilation_jquery

jQuery プラグインの種類:
1. jQuery メソッド:
このタイプのプラグインはオブジェクト メソッドをカプセル化するため、jQuery は jQuery で取得されます。セレクター。オブジェクト プロセス内で動作するため、jQuery の強力なセレクターを利用できます。
2. グローバル関数:
カスタム関数関数を jQuery 名前空間に独立してアタッチし、jQuery スコープ内のパブリック関数として使用することもできます。ただし、グローバル関数は jQuery オブジェクトにバインドされていないため、セレクターで取得した jQuery オブジェクトに対して呼び出すことはできません。 jQuery.fn() または $.fn() を通じて参照する必要があります。
3. セレクター:
jQuery が提供するセレクターが不十分または不便だと感じる場合は、セレクターのカスタマイズを検討できます。
jQuery プラグインの仕組み:
① jQuery.extend() メソッド: グローバル関数またはセレクターを作成できます。
による: いわゆるグローバル関数は、jQuery オブジェクトのメソッドです。実際には、このタイプの関数をユーティリティ関数と呼ぶ人もいます。それらは、DOM を直接操作しませんが、JavaScript の非要素オブジェクトを操作するか、jQuery の each() 関数や noConflict() 関数などの他の非オブジェクト固有の操作を実行します
例: に 2 つのパブリック関数を作成します。 jQuery 名前空間

コードをコピーします コードは次のとおりです。

jQuery.extend({
minValue : function(a,b ){
return a},
maxValue : function(a,b){
return a}
})
$(function(){
$("input").click(function(){
var a = prompt("値を入力してください? ");
var b = プロンプト("別の値を入力してください?");
var c = jQuery.minValue(a,b);
var d = jQuery.maxValue(a,b);
alert("入力した最大値は次のとおりです: " d "n入力した最小値は次のとおりです:
});
})

※ jQuery.extend() メソッドは、プラグインの作成以外にも jQuery オブジェクトの拡張にも使用できます。
例: jQuery.extend() メソッドを呼び出してオブジェクト a とオブジェクト b を新しいオブジェクトにマージし、マージされたオブジェクトを返して変数 c に割り当てます

コードをコピーします コードは次のとおりです:

var a = {name : "zhu",pass : 123}
var b = {名前 : "wang"、パス : 456、年齢 : 1}
var c = jQuery.extend(a,b);
$(function(){
for(c の変数名){
$("div ").html($("div").html() "
" name ":" c[name]);
}
})

例: jQuery グローバル関数の作成

コードをコピー コードは次のとおりです:

jQuery.css8 = {
minValue : function(a,b){
return a},
maxValue : function(a,b){
return a}
}
$(function(){
$("input").click(function(){
var a = プロンプト("値を入力してください?");
var b = プロンプト("別の値を入力してください");
var c = jQuery.css8.minValue(a,b); d = jQuery.css8.maxValue( a,b);
alert("入力した最大値は次のとおりです:" d "n入力した最小値は次のとおりです:"
}); )


By: jQuery 名前空間に関数を追加する場合は、新しい関数を jQuery オブジェクトのプロパティとして指定するだけです。 jQuery オブジェクト名は、$、jQuery.css8==$.css8 と省略することもできます。

② jQuery.fn.extend() メソッド: jQuery オブジェクトを作成するメソッド。
例: 最も単純な jQuery オブジェクト メソッドを見てみましょう

コードをコピーします コードは次のとおりです:

jQuery.fn.test = function(){

alert("これは jQuery オブジェクトのメソッドです!");
}
$(function(){
$("div ").click (function(){
$(this).test();
});
})