ホームページ  >  記事  >  ウェブフロントエンド  >  jQuery_jquery での $(document).ready() の使用の概要

jQuery_jquery での $(document).ready() の使用の概要

WBOY
WBOYオリジナル
2016-05-16 17:54:311088ブラウズ

jQuery について最初に学ぶべきことは、ページ上でイベントを実行したい場合は、$(document).ready() でイベントを呼び出す必要があるということです。 $(document).ready() に含まれるすべての要素またはイベントは、DOM の読み込みが完了した直後、ページ コンテンツが読み込まれる前に読み込まれます。
ページ上でイベントを動作させたい場合は、$(document).ready() 関数内でイベントを呼び出す必要があります。DOM がロードされるとすぐに、ページのコンテンツがロードされる前に、イベント内のすべてがロードされます。 🎜>

コードをコピー コードは次のとおりです:
$(document).ready(function() {
// ここに jQuery の利点をすべて入れてください。
});

ページ上でイベントが適切に動作することを確認する方法はたくさんあります $(document).ready( )他のものよりも優れています。 より多くの利点があります。まず、HTML に「動作」マークアップを追加する必要はありません。さらに、JavaScript/jQuery を別の js ファイルに書き込むことができます。これにより、保守が容易になり、js とページのコンテンツを確実に分離できます。 Web を閲覧するときに注意すると、このような状況がよく見られます。マウスを接続の上に置くと、ステータス バーに「javascript:void()」のようなメッセージが表示されることがあります。イベントを タグ内に直接配置すると、このようなことが起こります。

従来の JavaScript を使用している一部のページでは、 タグに「onload」属性が表示されます。これにより問題が発生します。ボディ上の関数イベントは 1 つだけと制限されてしまいます。はい、コンテンツに「行動」タグが追加されるためです。この問題を解決したい場合は、Jeremy Keith の著書『DOM Scripting』を参照してください。この本では、本体に複数の関数をロードできるようにする「addLoadEvent」関数を 1 つの js ファイルに作成する方法が説明されています。しかし、このメソッドは単純な問題に対してかなりの量のコードを記述する必要があります。さらに、このメソッドはウィンドウがロードされるときにこれらのイベントをトリガーするため、 $(document).ready() の利点を改めて思い出させられます。

$(document).ready() を使用すると、ウィンドウがロードされる前にイベントをロードまたは起動させることができます。このメソッドに記述したものはすべて、可能な限り早い時点でロードまたはトリガーされる準備ができています。つまり、DOM がブラウザーに登録されると、$(document).ready() 内のコードが実行を開始します。こうすることで、ユーザーが最初にページ要素を見たときに特殊効果を実行できます。