ホームページ >ウェブフロントエンド >jsチュートリアル >jqueryのreadyイベントとloadイベントの違いは何ですか?

jqueryのreadyイベントとloadイベントの違いは何ですか?

云罗郡主
云罗郡主転載
2018-10-29 16:46:312649ブラウズ

準備完了とロードではどちらが先に実行されますか? jqueryに触れたばかりの友人の中には、このような疑問を持つ人も多いと思います。この章では、jquery のreadyイベントとloadイベントの違いについて説明します。困っている友人は参考にしていただければ幸いです。

jqueryのreadyイベントとloadイベントの違いは何ですか?

準備完了と読み込みのどちらが最初に実行されるか:

面接プロセス中に、よく質問されます:準備完了と読み込みのどちらが最初に実行されるか? の後に実行されるのはどれですか?答えは、ready が最初に実行され、load が後で実行されるということです。

DOM ドキュメントをロードする手順:

最初にreadyが実行され、次にloadが実行される理由を理解するには、DOM ドキュメントをロードする手順を理解する必要があります:

(1) HTML 構造を解析します。

(2) 外部スクリプトとスタイルシートファイルを読み込みます。

(3) スクリプト コードを解析して実行します。

(4) HTML DOM モデルを構築します。 //ready

(5) 画像などの外部ファイルを読み込みます。

(6) ページがロードされました。 //load

ドキュメントの実行ステップから、ready は[ステップ 4]が完了した後に実行を開始するのに対し、load は [ステップ 6] が完了した後に実行を開始することがわかります

readyイベント:

ready イベントは、DOM 構造が描画された後に実行されます。これにより、多数のメディア ファイルが読み込まれていない場合でも、JS コードを実行できることが保証されます。

load イベント:

load イベントは、Web ページ内のすべてのコンテンツが読み込まれるまで待機してから実行する必要があります。 Web ページに多数の画像がある場合、Web ページのドキュメントはレンダリングされましたが、Web ページのデータが完全にはロードされていないため、load イベントをすぐにトリガーできないという状況が発生します。

要約:

皆さんはすでにreadyとloadの違いを理解していると思いますが、実際、ページ内に画像などのメディアファイルがない場合、readyとloadはほぼ同じです。ただし、ページにはファイルが含まれているため、職場ですぐに使用することをお勧めします。

上記は、flexbox フレキシブル ボックスをレイアウトする方法です。詳細なチュートリアルの完全な紹介。jQuery について詳しく知りたい場合は、PHP 中国語 Web サイトに注目してください。


以上がjqueryのreadyイベントとloadイベントの違いは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事はlvyestudy.comで複製されています。侵害がある場合は、admin@php.cn までご連絡ください。