jQueryの実行パターンとコンフリクトを避ける方法

jQueryの実行パターンとコンフリクトを避ける方法

JavaScriptライブラリといえば jQueryですが基本的な部分である実行のパターン、コンフリクトを避けるための方法を記しておきます。

jQueryを使ってJavaScriptを実行する際のパターン

jQueryの実行パターンは主に以下の3パターンになります。書き方によってスクリプトが実行されるタイミングが異なります。

JavaScript
//DOMの構築が完了後に実行
$(document).ready(function(){

  //命令
});

//DOMの構築が完了後に実行
$(function(){

 //命令
});

//DOMの構築が完了後&ページの内容(画像など)をブラウザ表示する準備ができてから実行 複数指定されている場合、最後の1回が実行される
$(window).load(function(){
  
 //命令
});

jQueryのコンフリクトを避ける方法

jQueryの $関数は、他のライブラリでも利用されているためコンフリクト(干渉)が発生する場合が有ります。例えば prototype.jsとのコンフリクトや jQueryのイージングと jQuery UIのイージングがコンフリクトする場合など様々なケースが存在します。

JavaScript
jQuery.noConflict();

(function($){

  $(document).ready(function(){
    
    //命令
  });
}(jQuery));

即時関数を使用し上記の様にする事でコンフリクトを避ける事が出来ます。

ページの先頭へ