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

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

キーポイント：

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

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

これにより、メソッド呼び出しがチェーンで作成できるようになります。たとえば、

<code class="language-javascript">return this;</code>

単純化された使用

<code class="language-javascript">$("div#myid").yourPlugin().anotherPlugin().yetAnotherPlugin();</code>

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

<code class="language-html"><p>My content</p></code>

適切な命名とバージョンの制御番号 jQueryプラグインは多数です。 「タブ」のような名前が使用されている可能性があります。これは必ずしも問題ではありませんが、あいまいまたは潜在的に矛盾する名前の使用は避けるべきです。特に開発者が問題を報告する場合、バージョン番号も重要です。

<code class="language-javascript">$(function() {
    $("section.myjqWidget").myjqWidget();
});</code>

3. 閉鎖の使用

に頼ってjqueryを引用しないでください。開発者が他のライブラリをインストールした場合、jQueryがロードされる前にフェッチされていた可能性があります。この問題を解決する最も簡単な方法は、匿名のセルフスタート関数の

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

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

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

プラグインは、

<code class="language-javascript">(function($) {
    // 此处的代码可以使用$来引用jQuery
})(jQuery);</code>

などのコードを使用してパラメーターを参照できます。

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

理想的には、HTMLウィジェットは、開発者がJavaScriptコードを変更する必要なくパラメーターを設定できるはずです。たとえば、html5データ属性の使用を検討する場合があります。

<code class="language-javascript">return this;</code>

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

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

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

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

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

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

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

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

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

<code class="language-javascript">$("div#myid").yourPlugin().anotherPlugin().yetAnotherPlugin();</code>

良い出発点を提供します：

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

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

開発者がプラグインを使用したい場合は、GitHub、Googleコード、jQueryプラグインディレクトリなどのコードベースにアップロードしてください。デモページを作成し、記事で宣伝し、Twitterに情報を投稿し続けます。次に、プラグインをサポートし、必要に応じて更新する準備をします。いくつかの愚かな質問と奇妙な機能のリクエストが得られますが、これはすべて成功したプラグインの著者であることの一部です。

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

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