ホームページ >ウェブフロントエンド >jsチュートリアル >Jquery plug-ins_jquery の作成に関する簡潔なチュートリアル

Jquery plug-ins_jquery の作成に関する簡潔なチュートリアル

WBOY
WBOYオリジナル
2016-05-16 16:54:401107ブラウズ

コードをコピー コードは次のとおりです:
/*
1. jQuery プラグイン他の JavaScript ライブラリ プラグインとの混同を避けるため、ファイル名には jquery .[プラグイン名].js という名前を付けることをお勧めします。たとえば、jquery.color.js
という名前を付けます。 2. すべてのオブジェクト メソッド名は jQuery.fn オブジェクトに付加され、すべてのグローバル関数は jQuery オブジェクト自体に付加される必要があります。
3. プラグイン内部では、chick() メソッドなどの一般的なメソッドとは異なり、this はセレクターを通じて現在取得されている jquery オブジェクトを指します。内部の this は dom 要素を指します。
4.すべての要素を走査するには、この .each を使用します
5. すべてのメソッドまたは関数プラグインはセミコロンで終わる必要があります。そうしないと、圧縮中に問題が発生する可能性があります。より安全にするために、プラグの先頭にセミコロンを追加することもできます。 -in. いいえ、
は、他の人の非標準コードがクエリに影響を与えるのを防ぎます。
6. プラグインがチェーンできることを確認するために、プラグインは jquery オブジェクトを返す必要があります。プラグインが文字列や配列
など、返す必要がある量を返す必要がある場合を除き、プラグイン内の jquery オブジェクトのエイリアスとして $ を使用することは避け、完全な jquery を使用して表現します。競合を避けるためです。もちろん、クロージャの手法を使用して
の問題を回避し、プラグインが $ を jquery のエイリアスとして引き続き使用できるようにすることもできます。
*/

//;互換性を高めるために、先頭にセミコロンがあります
;(function($){//ここで $ は匿名関数の仮パラメータとして使用されます
//$.fn.extend 拡張プラグイン
$.fn.extend({
"color":function(value){//color 自作プラグインメソッド名
/ /jQuery は css を提供します。メソッドは this.css("property","value");
return this.css("color",value);
}
});
}) (jQuery);//ここでは、jquery が実際のパラメータとして匿名関数


function red(){
alter($("#div" ).color() "プラグインが利用可能であることを証明する ");
alert($("#div").color("red") "プラグインが Jquery オブジェクトを返したことを証明する");
$("#div").color("red") ;
}
HTML でのプラグインの使用例:


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


声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。