jQueryでページロード時に実行する

jQueryのreadyメソッドを使用して、ページ読み込み時にjavascriptを実行することができる。

$(document).ready( function(){
// ページ読み込み時に実行したい処理
});

このreadyメソッドは次のように省略することもできる。

$(function(){
// ページ読み込み時に実行したい処理
});

 

【onloadイベントとjQueryのreadyメソッドの違い】 JavaScriptでは次のようにonloadイベントでページ読み込み時に実行したい処理を設定することができる。

window.onload = function(){
// ページ読み込み時に実行したい処理
}

上記onloadはjQueryでは次のようになる。

$(window).on('load',function(){
    // ページの読み込みが完了した後に実行するコード
});

jQueryのreadyメソッドとの違いは次のとおりである。

・jQueryのready()メソッド

DOMツリーの構築が完了した時点で処理を実行する。

・onloadイベント

DOMツリーの構築だけでなく、画像などの関連データの読み込みが完了しないと処理を実行しない。