web-dev-qa-db-ja.com

jQueryイベント.load（）、. ready（）、. unload（）

JQueryイベントに対する簡単な質問です。 DOMがロードされると、.load（）、. ready（）、および.unload（）は順番に実行されますか？ jQueryのドキュメントを見ると、答えはイエスのようです。

<script type="text/javascript">

    $(window).load(function () {
        // run code
        initializeCode();
    });

    $(document).ready(function() {
        //run code that MUST be after initialize
    });

    $(window).unload(function() {
        Cleanup();
    });
</script>

ただし、.ready（）内のコードは、initializeCode（）の前に実行されます。実行されるので、私は本当に奇妙に感じます。そして今、コードを.onload（）メソッド内とinitializeCode（）の直後に配置する必要があります。行。これは.ready（）ブロック内にあることを意味します。

JQueryが初めてなので、誰かがこれについてもっと説明してもらえますか？

javascriptjqueryeventsdom
70
Eric

注：.load()＆.unload()は 非推奨 になっています

$(window).load();

ページとそのすべてのコンテンツの読み込みが完了した後に実行されます。つまり、すべての画像、CSS（およびカスタムフォントや画像などのCSSで定義されたコンテンツ）、スクリプトなどがすべて読み込まれます。これは、ブラウザーの「停止」アイコンがいわばグレーになったときに発生するイベントです。これは、ドキュメントとそのすべてのコンテンツがロードされたことを検出するのに非常に便利です。

$(document).ready();

一方、これは、WebブラウザーがJavaScriptを実行できるようになるとすぐに起動します。これは、パーサーがDOMを処理した後に発生します。これは、できるだけ早くJavaScriptを実行する場合に便利です。

$(window).unload();

このイベントは、ページから移動しているときに発生します。それは、Refresh/F5、前のページボタンを押す、別のWebサイトに移動する、またはタブ/ウィンドウ全体を閉じることです。

まとめると、load（）の前にready（）が起動され、unload（）が最後に起動されます。

127
Tower

ウィンドウの読み込みは、すべてのリソースが読み込まれるのを待ちます。

document ready ドキュメントが初期化されるのを待ちます。

文書をアンロードするまで待機します。

順序は次のとおりです。ドキュメントの準備、ウィンドウのロード、... ... ... ...ウィンドウのアンロード。

画像の読み込みを待つ必要がない限り、常にドキュメントの準備完了を使用します。

ドキュメント準備の略記：

$(function(){
    // yay!
});
11
David Murdoch

両方の「document.ready」バリアントが使用される場合、それらは両方とも出現順に起動します

$(function(){
    alert('shorthand document.ready');
});

//try changing places
$(document).ready(function(){
    alert('document.ready');
});
6
ljgww

また、.loadと.readyのもう1つの違いに気付きました。子ウィンドウを開いており、子ウィンドウが開いたときにいくつかの作業を実行しています。 .loadは、ウィンドウを開いたときに初めて呼び出されます。ウィンドウを閉じない場合、.loadは再度呼び出されません。ただし、子ウィンドウを閉じるかどうかに関係なく、毎回.readyが呼び出されます。

0
Praveen Singh