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

Susan Sarandon
リリース: 2024-11-06 07:06:02
オリジナル
194 人が閲覧しました

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 サイトの他の関連記事を参照してください。

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