jQuery の競合フリー モードを実装する方法

jQuery 競合フリー モードを実装する方法: まず、対応する jQuery コード ファイルを開き、次に noConflict メソッドを通じて $identifier の制御を他の JavaScript ライブラリに返し、競合を解決します。

この記事の動作環境: Windows 7 システム、jquery バージョン 3.2.1、Dell G3 コンピューター。

jQuery コードを他の JavaScript ライブラリと併用すると、競合が発生する可能性があります。たとえば、jQuery で $ 記号を使用すると、$ 記号をショートカットとして使用する別のライブラリが発生することがあります。これにより競合が発生する可能性があります。ただし、jQuery は競合状況を処理するための特別なメソッドを提供します。次に記事では、一定の参考価値のあるjQueryにおける競合解決方法を詳しく紹介しますので、皆様のお役に立てれば幸いです。

競合を解決するメソッド:

jQuery で競合を解決するメソッドは、$identifier の制御を他の JavaScript ライブラリに返す noConflict() メソッドです

次の例の jQuery コードは、ページにロードされるとすぐに jQuery を競合フリー モードにし、プロトタイプ フレームワークとの競合を避けるために $alias を置き換える新しい変数名 $j を割り当てます。詳細なコードは次のとおりです:

// 为jQuery定义新的名字
var $j = jQuery.noConflict();
$j(document).ready(function(){
    // 单击demo时弹出对话框
    $j("#demo").click(function(){
        alert("这是jQuery的新定义");
    });
});
 
//原型框架代码
document.observe("dom:loaded", function(){
    // 点击demo1显示弹出框
    $(demo1).observe('click', function(event){
        alert("原型与jQuery一起正常运行");
    });
});

レンダリングは次のとおりです:

ただし、jQuery の別のショートカットを定義したくない場合は、既存の jQuery コードを変更したくない場合、または $ が jQuery での時間を大幅に節約し、使いやすいと感じる場合は、代わりに別の方法を使用できます

$ をパラメータとして jQuery に渡すことができます(document).ready() function

// 为jQuery定义新的名字
jQuery.noConflict();
jQuery(document).ready(function($){
    // The dollar sign in here work as an alias to jQuery
    $("#demo").click(function(){
        alert("jQuery正在正常工作");
    });
});
 document.observe("dom:loaded", function(){
 $(demo1).observe('click', function(event){
        alert("jQuery与原型一起正常使用");
});
});

【おすすめコース: jQuery チュートリアル】

レンダリング:

注:

競合を回避する上記の解決策は、prototype.js の後に jQuery をロードすることに依存しています。ロードされています。ただし、他のライブラリの前に jQuery を組み込む場合は、jQuery.noConflict() を呼び出さなくても、jQuery コード内で完全な名前を使用して競合を回避できます。ただし、この場合、$ は他のライブラリで定義されている意味を持ちます。

要約: 上記がこの記事の全内容です。皆様のお役に立てれば幸いです。

以上がjQuery の競合フリー モードを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。