すべてのjsがロードされた後にjqueryが実行されますか?

PHPz
リリース: 2023-05-18 14:06:08
オリジナル
714 人が閲覧しました

JavaScript と jQuery を使用するときは、通常、コードの実行順序に注意する必要があります。特に、非同期読み込み、依存関係、イベント コールバックなどに関しては、慎重に考える必要があります。よくある質問の 1 つは、jQuery はロード直後にすべての js を実行しますか? というものです。

まず、いくつかの基本的な知識を理解する必要があります。ブラウザに JavaScript ファイルをロードするには、同期と非同期の 2 つの方法があります。

同期読み込みとは、ブラウザが HTML タグを解析するときに、タグの順序で JavaScript ファイルを 1 つずつ読み込み、読み込みが完了した後、JavaScript コードを順番に実行することを意味します。この方法は比較的単純ですが、ページに大量の JavaScript ファイルが含まれている場合、ブラウザはページの他の部分の読み込みを続ける前に JavaScript ファイルをダウンロードする必要があるため、ページの読み込み速度に影響を及ぼし、ページがゆっくりロードします。

非同期読み込みとは、ブラウザが HTML タグを読み込むときに、ページの他の部分の読み込みをブロックしないことを意味します。ロードする必要がある JavaScript ファイルが見つかった場合、ブラウザはページのロードを続行し、JavaScript ファイルを非同期的にロードします。 JavaScript ファイルがロードされても、ブラウザはそれをすぐには実行しません。実行の順序は、ファイルがロードされる順序とは関係ありません。一般に、非同期で読み込まれる JavaScript ファイルは、ページが読み込まれた直後に実行されますが、これは絶対的なものではありません。

それでは質問自体に戻りますが、jQuery はすべての js ファイルがロードされた後すぐにそれを実行しますか?答えは必ずしもそうではありません。

同期読み込みを使用して jQuery の js ファイルを読み込む場合、すべての js ファイルが読み込まれた直後に jQuery が実行されます。同期読み込みの場合、ブラウザーは HTML タグの解析を続行する前に、まず JavaScript ファイルを読み込む必要があるため、jQuery js ファイルを読み込んだ後、コードはすぐに実行されます。

ただし、最新の Web アプリケーションでは、JavaScript ファイルの読み込みに非同期読み込みを使用することが多くなります。これにより、ページの読み込み速度が向上し、コードの最適化とメンテナンスにも役立つためです。この場合、ブラウザはページの他の部分のロードを続けるため、jQuery の js ファイルはロード直後には実行されません。つまり、jQuery の js ファイルがロードされても、ブラウザがロードするまですぐには実行されません。ブラウザーはページの解析とレンダリングを完了し、すべての非同期スクリプトがロードされて解析されるのを待ってから jQuery が実行されます。

ただし、コード内で $(document).ready() や $(function(){}) などの jQuery ドキュメント読み込みイベントを使用する場合、これらのイベントは次のように処理されることに注意してください。 jQuery ロード直後に実行されます。これらのイベントはドキュメント オブジェクトにバインドされており、ページが解析されてレンダリングされるまでドキュメント オブジェクトは読み込まれないためです。したがって、jQuery js ファイルを非同期でロードすると、コードはすぐには実行されませんが、ドキュメント オブジェクトがロードされると、ドキュメント オブジェクトにバインドされたイベントがトリガーされて実行されるため、すべて $(document) を使用します。 ready( ) または $(function(){}) およびその他の jQuery ドキュメント読み込みイベント コードは、jQuery が読み込まれた直後に実行されます。

要約すると、すべての jQuery js が読み込み直後に実行されるかどうかは、読み込みメソッドとコード ロジックに依存します。同期読み込みメソッドであり、コードがドキュメント読み込みイベントにバインドされていない場合は、すぐに実行します。非同期ロード メソッドまたはドキュメント ロード イベントにバインドされたコードの場合は、実行の機会を待つ必要があります。したがって、Web ページ用の JavaScript コードを作成する場合は、コードをより適切に最適化し、アプリケーションのパフォーマンスを向上させるために、JavaScript と jQuery の読み込みの方法と原則を完全に理解する必要があります。

以上がすべてのjsがロードされた後にjqueryが実行されますか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト:福祉オンライン PHP トレーニング,PHP 学習者の迅速な成長を支援します!