jQuery - noConflict()メソッド
jQueryを使用しながら、ページで他のフレームワークを使用したい場合はどうすればよいでしょうか?
jQueryおよびその他のJavaScriptフレームワーク
すでにご存じのとおり、jQueryは、この$
記号をjQueryのショートカットとして使用します。
Angular、Backbone、Ember、Knockoutなど、他にも多くの人気のあるJavaScriptフレームワークがあります。
他のJavaScriptフレームワークでも$記号をショートカットとして使用するとどうなるでしょうか?
2つの異なるフレームワークが同じショートカットを使用している場合、そのうちの1つが機能しなくなる可能性があります。
jQueryチームはすでにこれについて考えており、noConflict()
メソッドを実装しました。
jQueryのnoConflict()メソッド
このnoConflict()
メソッドは$ショートカット識別子の保持を解放し、他のスクリプトがそれを使用できるようにします。
もちろん、ショートカットの代わりに完全な名前を書くだけで、jQueryを使用できます。
例
$.noConflict();
jQuery(document).ready(function(){
jQuery("button").click(function(){
jQuery("p").text("jQuery is still working!");
});
});
独自のショートカットを非常に簡単に作成することもできます。noConflict()
メソッドは、後で使用するために変数に保存できるjQueryへの参照を返します。以下に例を示します。
例
var jq = $.noConflict();
jq(document).ready(function(){
jq("button").click(function(){
jq("p").text("jQuery is still working!");
});
});
$
ショートカットを使用するjQueryコードのブロックがあり、それをすべて変更したくない場合は、$
サインインをパラメータとしてReadyメソッドに渡すことができます。これにより、この関数の内部で$
を使用してjQueryにアクセスできるようになります。関数の外部では、「jQuery」を使用する必要があります。
例
$.noConflict();
jQuery(document).ready(function($){
$("button").click(function(){
$("p").text("jQuery is still working!");
});
});
jQueryその他のリファレンス
すべてのjQuery Miscメソッドの完全な概要については、jQueryその他のリファレンスを参照してください。
プログラミング学習を加速させる
プログラミングをプロの講師に教えてもらいませんか。