jQueryでHTML読み込み完了後にスクリプトを実行したい場合、いくつか構文がある。
最もよく使われるのが下記。この中に記述したスクリプトがHTML読み込み完了後に実行される。
$(function(){
・・・
});
「$」は「jQuery」の略なので、下記も同じ。
jQuery(function(){
・・・
});
readyイベントを使う方法もあり。
$(document).ready(function(){
・・・
});
3つとも動作に違いはないが、一般的には最初の$(function(){・・・を使う。特別な理由がない限りこれを使っていればよいだろう。
また画像などの外部ファイルも含め、すべて読み込んだ時点で実行したい場合は、下記のように記述する。 前述の3つと実行順序の前後関係はないようである。(画像が即時に表示される場合は、前述3つよりも早く実行されることもあるよう)
$(window).on('load', function() {
・・・
});
なお下記の記述方法は、jQuery3.0以降は廃止されている。
$(window).load(function() {
・・・
});