jQuery API の jQuery( callback ) は、DOMの読み込みが完了したときに、callback関数を実行する。
jQuery( document ) . ready( handler )の省略形。（参照：ready( fn )）
引数
- callback
DOMの読み込み完了時に実行するcallback関数。
戻り値
- jQuery
jQueryオブジェクト。
記述方法
jQuery( function() {
// 処理
} );
// 処理
} );
DOMの読み込み完了時に、処理を実行。
jQuery( function( $ ) {
// 処理
} );
// 処理
} );
DOMの読み込み完了時に、処理を実行。処理の中で、jQueryの別名（エイリアス）として「$」を使用できる。
jQuery( function( j ) {
// 処理
} );
// 処理
} );
DOMの読み込み完了時に、処理を実行。処理の中で、jQueryの別名（エイリアス）として「j」を使用できる。
実装例（サンプル）
実装例（サンプル）について
本来は、300px × 198px の画像だが、152px × 100px で表示している。
実装例（サンプル）のソースコード
JavaScript
<script>
<!--
jQuery( function() {
if( jQuery( 'img.jquery-api-ready' ) . height() > 100 ) {
jQuery( 'img.jquery-api-ready' ) . addClass( 'jquery-api-ready-addClass' );
}
} );
// -->
</script>
<!--
jQuery( function() {
if( jQuery( 'img.jquery-api-ready' ) . height() > 100 ) {
jQuery( 'img.jquery-api-ready' ) . addClass( 'jquery-api-ready-addClass' );
}
} );
// -->
</script>
CSS
<style>
<!--
.jquery-api-ready {
border: 1px solid gray;
}
.jquery-api-ready-addClass {
height: 100px !important;
}
-->
</style>
<!--
.jquery-api-ready {
border: 1px solid gray;
}
.jquery-api-ready-addClass {
height: 100px !important;
}
-->
</style>
HTML
<img src="1.jpg" class="jquery-api-ready" />
<img src="2.jpg" class="jquery-api-ready" />
<img src="3.jpg" class="jquery-api-ready" />
<img src="2.jpg" class="jquery-api-ready" />
<img src="3.jpg" class="jquery-api-ready" />
別の書き方
jQuery( function() {
は、下記のように書いても同じ。
jQuery( document ) . ready( function() {
jQuery() . ready( function() {