私たちが作成している Web サイトでは、いくつかの一般的な JavaScript 機能を独自の種類の util jQuery プラグインにカプセル化したいと考えていました。私はカスタム jQuery プラグインの作成にかなり慣れていないので、このページはすばらしいリソースであることがわかりました。私は基本的にそこに例をコピーしました (もちろん独自の機能を使用して) が、特定の DOM オブジェクトで実行する必要のないメソッドがいくつかあることがわかりました。そのため、次のようにドキュメントを選択していることに気付きました。
$(document).myPlugin("myFunction", "my", "params");
関数でまったく使用されていないランダムな要素を選択するだけであるという事実が気に入らなかったので、いくつかをグーグルで検索して、この質問を見つけました。これは素晴らしい情報でしたが、関数を実行するために DOM 要素をまったく必要としないケースでした。この2つを組み合わせることができるのではないかと考えました。だから、私がもともとこれを持っていた場所:
(function($) {
var methods = {
//... all my methods
}
$.fn.myPlugin = function(method) {
// Method calling logic
if (methods[method])
{
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
}
else if (typeof method === 'object' || !method)
{
return methods.init.apply(this, arguments);
}
else
{
$.error('Method ' + method + ' does not exist on jQuery.myPlugin');
}
};
})(jQuery);
私は単にこれを次のように変更しました:
(function($) {
var methods = {
//... all my methods
}
$.myPlugin = $.fn.myPlugin = function(method) {
// Method calling logic
if (methods[method])
{
return methods[method].apply(this, Array.prototype.slice.call(arguments, 1));
}
else if (typeof method === 'object' || !method)
{
return methods.init.apply(this, arguments);
}
else
{
$.error('Method ' + method + ' does not exist on jQuery.myPlugin');
}
};
})(jQuery);
思い通りに動いているようです。DOM 要素を必要としない関数を呼び出したい場合は$.myPlugin("myFunction1", "my", "params");
を呼び出し、特定の DOM 要素で関数を呼び出したい場合は を呼び出します$("#elementId").myPlugin("myFunction2", "my", "params");
この非常に長い説明の後、私の質問は、これを行う際に懸念すべき潜在的な落とし穴や問題はありますか? 私が言ったように、それは私にとってはうまくいっていますが、これを行うことで何か問題があるかどうか、または潜在的な問題があるかどうか知りたいですか? 同じことを達成するためのより良い方法があれば、共有してください。ありがとう!