[JavaScript] jQueryでdocument.readyを遅らせて発火したい

2022.01.24

この記事は公開されてから1年以上経過しています。情報が古い可能性がありますので、ご注意ください。

こんにちは。きんくまです。

jQueryを使っているサイトのソースを書くことがありました。
それで、document.readyを遅らせて発火させたかったです。

  1. 外部htmlを本体のhtmlに非同期で読み込み
  2. 1の外部htmlには$(funciton() {}) が書いてある
  3. 通常だと1をやる前にすでに本体のreadyが発火ずみ。2を発火させるにはどうするか?

調べたところ、公式にドキュメントがありました。

jQuery.holdReady()

$.holdReady( true ); // readyを発火させないようにする
$.getScript( "myplugin.js", function() {
  $.holdReady( false ); // readyを発火させる
});

ただし、ドキュメントにもある通りこのメソッドは3.2以降でdeprecatedとのこと。
それ以降はcustom promiseを書いてくださいだそうです。

ちなみに色々調べてたら、jQueryのreadyは発動するとイベントがunbindされて、2度と発動できないようになっているようです。
Can I call $(document).ready() to re-activate all on load event handlers?

おまけ

window.onloadは

window.dispatchEvent(new Event('load'));

で後から発火できました。
外部htmlに $(window).on('load',function(){}) が書いてあっても実行されました。