ready

推奨される書き方

$(function () {
  /* handler code */
})

jQuery 3.0 以降では非推奨

$(document).ready(function () {
  /* handler code */
})

参考:

.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 | MDN

on(‘load’, handler)

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

$(window).on('load', function () {
  /* handler code */
});

参考:

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

.load() | jQuery API Documentation

ready と load の違い/順序

参考:

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

ネイティブでハンドラを処理する

参考:

$(document).ready equivalent without jQuery – Stack Overflow

DOM の描画完了を知る方法

参考:

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

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

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

参考:

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

on append() do something – Stack Overflow

MutationObserver | MDN

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

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

$(window).on('load', function () {
  /* handler code */
});

参考:

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

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

タグ:

コメントを残す

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