より優れたjQueryプラグインを開発するための10のヒント

優れたjQueryプラグインは、世界中の何万人ものWeb開発者の間で人気がありますが、デザインが不十分な人はすぐに忘れられています。この記事では、より良いjQueryプラグインを開発し、その影響力を高めるためのいくつかのヒントを提供します。

キーポイント：

• それを呼び出すjQueryオブジェクトを返すことにより、jQueryプラグインがチェーン対象であることを確認し、複数のjQueryメソッドをリンクできるようにします。
• jQueryプラグインのデフォルト設定を提供し、ユーザーが自分のニーズに応じてカスタマイズできるようにし、HTMLパラメーターをサポートして簡単に使用できると考えています。
• jqueryプラグインは、github、Googleコード、jQueryプラグインディレクトリなどのコードベースにプロモーションのためにアップロードし、サポートと必要な更新を提供する準備ができています。

1. チェーンコールの完全性を維持します
プラグインが値を返しない限り、プラグイン関数の最後の行は次のようにする必要があります。

return this;

$("div#myid").yourPlugin().anotherPlugin().yetAnotherPlugin();

2. ほとんどの場合、開発者がドキュメントを検索したり、オプションを設定したり、プラグインコードを編集したりすることなく、プラグインが適切に動作するはずです。ビジュアルウィジェットの場合、開発者はJavaScriptコードを編集する必要はありません。 HTMLにクラス/IDを提供するだけで、コードを自動的に起動することなど、次のようになります。
プラグインは単独で初期化できます。

<p>My content</p>

$(function() {
    $("section.myjqWidget").myjqWidget();
});

3. 閉鎖の使用<

パラメーターとしてjqueryを渡すことです。

4. デフォルトのパラメーターを設定

ほとんどのプラグインは、JavaScriptオブジェクトリテラル表記を使用してパラメーターを設定します。たとえば $ $これにはいくつかの利点があります。パラメーターは読みやすく、任意の順序で配置することも、完全に省略できます。ただし、プラグインコードでデフォルト値を設定し、それに応じて上書きする必要があります。 $

(function($) {
    // 此处的代码可以使用$来引用jQuery
})(jQuery);

5. サポートHTMLパラメーター

return this;

これらには、jQueryのdata()メソッド：.data("opt1")を介してアクセスできます。

7. コードドキュメントを書く

プラグインの上部に簡潔なコメントを追加してください、説明：

• プラグインの名前とバージョン
• プラグイン関数
• 使用例
• パラメーター
• 連絡先とサポートリンク

プラグインが特に複雑な場合は、別のREADMEファイルを検討できます。

8. プラグインを徹底的に試してみてください

テストします。次に、もう一度テストします。すべてのブラウザでテストします。 IE6互換性の問題など、修正できない問題があるかもしれません。それは問題ではありませんが、それはあなたのドキュメントで言及されています。

9. 適切なテンプレートを使用してください

新しいプラグインを作成するときに使用したテンプレートコードは次のとおりです。

$("div#myid").yourPlugin().anotherPlugin().yetAnotherPlugin();

プラグインは閉鎖に包まれています。
プラグインパラメーターによって上書きされるデフォルトオプションを設定します。
選択した各要素は、
• 関数のjQueryオブジェクトとして渡されます。 DoSomething
• が含まれます。 return this;
自動スタートコードは最後に提供されます。

10. プラグインを宣伝します

（後続のコンテンツ、すなわちFAQパーツは、記事の長さのために個別に処理することをお勧めします。FAQパーツは別々に新しい答えに分類できます。

以上がより優れたjQueryプラグインを開発するための10のヒントの詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。