jquery_jquery でのドル記号の名前付けの競合問題を解決する

Jquery では、$ は JQuery のエイリアスです。たとえば、$('#msg') は JQuery('#msg') と同等です。ただし、複数の js ライブラリを導入し、別の js ライブラリでも $ 記号が定義されている場合、$ 記号を使用すると競合が発生します。以下はjquery.jsとprototype.jsという2つのライブラリファイルを導入する例です。

最初のケース: jquery.js は、prototype.js の後に導入されます。例: script src = "prototype.js" type = "text/javascript " />
script src = " jquery.js " type = " text/javascript " />
この場合、独自の JS コードで次のように記述します。 >$ は常に jquery で定義された $ 記号を表し、JQuery('#msg').hide(); と記述することもできます。prototype.js で定義された $ を使用したい場合は、後で紹介します。

2 番目のケース: jquery.js がprototype.js の前に導入されます。例:
script src = " jquery.js " type = " text/javascript " />
script src = "prototype.js" type = "text/javascript " />
この場合、独自の JS コードで次のように記述します。 $ は現時点でprototype.jsで定義されている$記号を表します。jquery.jsでファクトリ選択関数を呼び出したい場合は、フルネームのJQuery('#msg').hide()を使用するだけです。 以下では、まず、JS ライブラリ ファイルの順序を導入する最初のケースで、さまざまな JS ライブラリで定義されている $ 記号を正しく使用する方法を紹介します。

1. JQuery.noConflict() を使用します。
このメソッドの機能は、jquery.js が後で導入されたため、Jquery に $ の所有権を放棄させ、$ の制御をprototype.js に戻すことです。したがって、$ を制御できる最後のものは jquery です。戻り値はJQueryです。コード内でこのメソッドを呼び出した後、$ を使用して jquery メソッドを呼び出すことはできません。このとき、$ は、prototype.js ライブラリで定義された $ を表します。以下のように: JQuery.noConflict();
// ここで $('#msg').hide() を記述することはできません。このときの $ は、prototype.js で定義されている $ 記号を表します。
JQuey( ' #msg ' ).hide();
今後、$ は、prototype.js で定義されている $ を表します。jquery.js の $ は使用できなくなります。 jquery.js の正式名は JQuery です。

2. JQuery のエイリアスをカスタマイズする
最初のメソッドで JQuery.noConflict() メソッドを使用した後、JQuery の完全名だけを使用するのが面倒な場合は、JQuery のエイリアスを再定義することもできます。 JQuery。以下のように:
var $j = JQuery.noConflict();
$j( ' #msg ' ).hide(); // ここで、$j は JQuery を表します
以降、$ は定義されたプロトタイプを表しますin .js と jquey.js の $ は使用できなくなり、jquey.js では $j を JQuery のエイリアスとしてのみ使用できます。

3. ステートメント ブロックを使用します。
JQuery.noConflict();
JQuery(document).ready(function() $ ){ $( ' #msg ' ).hide(); // この時点で、ready イベントメソッド全体で使用される $ は、jquery.js で定義された $ です。 }); 🎜> (function($){ $( ' #msg ' ).hide(); // このとき、このステートメントブロックでは jquery.js で定義した $ が使用されます。 })(JQuery)
If in js ライブラリ ファイルの順序を導入する 2 番目のケース、jquery.js で $ を使用する方法では、次のような上記で紹介したステートメント ブロック メソッドを引き続き使用できます。

script src = " jquery.js " type = " text/javascript " />

スクリプト src = "prototype.js" type = " text/javascript " />

スクリプト タイプ = " text/javascript " >
(function ($){ $( ' #msg ' ).hide(); // このとき、このステートメントブロックでは jquery.js で定義した $ を使用します。 })(JQuery)
script > このステートメント ブロックを使用する方法は、jquery プラグインを自分で作成する場合、特定の作業プロセス中にさまざまな js ライブラリを順番に導入する方法がわからないため、この方法を使用する必要があります。 、およびこの種のステートメント ブロック書き込み方式を使用すると、競合をシールドできます。
ps: jquery の特殊文字の意味:
# 命令 ID 🎜>~ Brother
Next : サブ (多機能)
() 機能フィルタリングと検索