readyメソッド【jQuery入門】

readyメソッド

$(function() {
 
//「処理A」を記述する
 
});

$(document).ready(function() {
 
//「処理A」を記述する
//「処理B」を記述する
//「処理C」を記述する
 
})

HTMLの読み込みが終わった時点で処理が実行される。

「$」を「jQuery」に置き換えても同じように動作する。

jQuery(document).ready(function() {
//「処理A」を記述する
});

jQuery(function(){
//「処理A」を記述する
});

「$」は単純な関数名でしかないので簡単に上書きできてしまう。他のプラグインやライブラリなどでも「$」が利用されている場合、jQuery側で正しく動作しないことがある。

readyとloadの位置

1. ページの読み込みが始まる
2. HTMLの読み込みが終わる
3. $(document).readyが実行
4. 画像など含めすべてのコンテンツの読み込みが終わる
5. $(window).loadが実行

$(window).on('load', function() {
 
    //ここに処理を書く
 
});

もし処理が画像のサイズに依存するようなものであれば、.ready()ではなく.load()を使用。

関連リンク

.ready() | jQuery API Documentation

api.jquery.com