ready

// 推奨される書き方
$(function () {
  // ハンドラのコード
})
// jQuery 3.0 以降では非推奨
$(document).ready(function () {
  // ハンドラのコード
})

参考:

.ready() | jQuery API Documentation

jQuery の $(document).ready(function (){}); について | サポンテ 勉強ノート

$(document).ready – Qiita

jQuery の $() は何をしているのか、DOMContentLoaded と load の違い – GitHub Gist

DOMContentLoaded との違い

参考:

Pure JavaScript equivalent of jQuery’s $.ready() – how to call a function when the page/DOM is ready for it – Stack Overflow

DOMContentLoaded – Web 技術のリファレンス | MDN

on(‘load’, handler)

.load() は jQuery 3.0 で廃止された。代わりに .on('load', handler) を使う。

$(window).on('load', function () {
  // ハンドラのコード
});

参考:

jQuery の ready() や load() のタイミングの違い | flatFlag

.load() | jQuery API Documentation

ready と load の違い/順序

参考:

jQuery の読込み「ready」と「load」と「function」の順番について | web-wizardry

DOM の描画完了を知る方法

参考:

jQuery で特定の DOM の表示が完了したタイミングを取る | y.okano blog

DIV 要素に onload の代用になるものはありますか? – スタック・オーバーフロー

要素の追加を検出する方法

参考:

動的に読み込んだ DOM 要素の表示完了時に jQuery プラグインを適用したい – スタック・オーバーフロー

on append() do something – Stack Overflow

MutationObserver | MDN

画像を含んだ要素の幅や高さを取得する

on('load', ...) を使う

$(window).on('load', function () {
  // 処理
});

参考:

jQuery で画像の幅や高さの取得が不安定な場合は、ページ読み込み実行処理の書き方に注意!| KuroBox

.load() | jQuery 1.9 日本語リファレンス | js STUDIO

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です