ホームページ >ウェブフロントエンド >jsチュートリアル >jQuery を使用せずに $(document).ready() の機能を実現するにはどうすればよいですか?

jQuery を使用せずに $(document).ready() の機能を実現するにはどうすればよいですか?

Susan Sarandon
Susan Sarandonオリジナル
2024-11-06 07:06:02307ブラウズ

How Can I Achieve the Functionality of $(document).ready() Without Using jQuery?

jQuery を使用しない $(document).ready() と同等

jQuery の $(document).ready() 関数は、コールバックを実行する前に DOM がロードされるのを待機するイベント ハンドラー。 jQuery を使用していない場合は、次のコード スニペットを使用して同じ効果を実現できます。

document.addEventListener("DOMContentLoaded", function() {
  // code...
});

このメソッドは、DOM ツリーが作成されたときに発生する「DOMContentLoaded」イベントにリスナーをアタッチします。

window.onload との違い

window.onload は $(document) とまったく同じように動作しないことに注意することが重要です。 。準備ができて()。 window.onload は DOM がロードされ、すべての要素のロードが完了するのを待機しますが、$(document).ready() は DOM がロードされるのを待つだけです。これは、スクリプトが存在する DOM 要素に依存している場合、特に外部リソースを扱っている場合に重要になります。

IE8 およびそれ以前の同等

より古いブラウザの場合IE9 では、次のコード スニペットを使用できます。

document.onreadystatechange = function () {
    if (document.readyState == "interactive") {
        // Initialize your application or run some code.
    }
}

このコードは、ドキュメントの「対話型」状態をチェックします。これは、DOM ツリーがロードされているが、外部リソースがまだロードされている可能性があることを示します。

以上がjQuery を使用せずに $(document).ready() の機能を実現するにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。