jqueryタブがdocument.ready内にある必要がありますか？

Question

document.readyがどういうことをしているのか少し混乱しています。 john resigのtutorialによると、document.readyには、ページの読み込みが完了したときに実行する必要があるコードが含まれている必要があります。

タブを宣言するコードがある場合、またはテーブルにゼブラストライプを配置するコードはどうでしょうか？

すべてがdocument.readyの下に移動する必要がありますか？ユーザーが最初に読み込まれたコンテンツを参照してから、ゼブラのハイライトとタブが表示されるケースがありますか？

Answer 1

優れた点ですが、問題は、影響を受けるコンテンツがロードされる前にゼブラストライプコードを実行するとどうなりますか？そこに擦り傷があります。

あなたのコンテンツにあなたのJSを振りかけることができます。そのため、そのコンテンツは実行前にロードされますが、このJSも同様にロードする必要があるjqueryライブラリですか？今よりも多くのことが間違っている可能性があります。

jquery Readyイベントは、従来のdocument.onLoadイベントよりも前に実行されることに注意してください。 （画像の読み込みが完了するのを待つ）

Answer 2

一般に、DOM内の何かに影響を与える場合は、document.readyに入れてください。そう、はい、あなたのタブとゼブラの縞がそこに行かなければなりません。

Answer 3

onDOMReady関数の中にjQueryタブのコードを入れる必要があります。あなたはDOMは、修正のための準備ができたときに、必要なコードが実行されることを確実にしているこの機能を使用する（ただし、ページ自体が完全にロードされていない可能性がありますすることで

$(function(){ 
    //put your tab/zebra stripes code here 
}); 

：安全のためには、jQueryの提供する機能を使用します）。 document.readyにロードされる他のコードは、おそらくdocument.readyを使用すると、動的JavaScriptを読み込んでいるときに画面にちらつきが表示される可能性があるため、この関数内ではさらに良いでしょう。

Answer 4

もちろん、ゼブラストライプのような単純なものには古典的なjavascriptを使用し、難しいものについてはjQueryを使用することもできます。

Answer 5

準備完了イベントは、DOMが完全にロードされたときに起動されますが、DOMがロードされたときにロードイベントが発生する+ DOMによって参照されるすべてのイメージもダウンロードされます。

これは、初期化コードがDOMの画像を使用していない限り、readyイベントを使用する必要があることを意味します。 See this pageたとえば、ロードイベントでDOMからイメージにアクセスしようとすると何が起こるかを示します。