2011-08-13 15 views
7

は、次の行は、私はHTMLのパース順序についてはよく分からない公式jQueryのウェブサイトHTML解析順/スクリプトの実行順序

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script>!window.jQuery && document.write('<script src="http://code.jquery.com/jquery-1.4.2.min.js"><\/script>');</script> 

からある、または私は、スクリプトの実行順序を言う必要があります。

問題は次のとおりです。回線2が回線1をロードするのを待ちますか?疑わしい。

1行目がまだ読み込まれている(3000KBと長くかかる)と、2行目がすでに実行されているとします。 window.jQueryは常にfalseとなるため、2番目のjsは常に含まれます。それが本当なら、とにかく1号線は何ですか?

答えて

12

スクリプトはドキュメント内の順に実行されます。ブラウザは、それに続くスクリプトを実行する前にスクリプトが読み込まれるのを待ちます。

これが当てはまらない場合、2つのファイルが互いに依存することはありません。スクリプトの実行順序が実質的にランダムになるため、すべて同じファイルに入れる必要があります。

+0

ああ...それを得ました。ありがとう。 – kae

1

はい、スクリプトが読み込まれ、解析されるまで、任意のHTMLを解析するのを待機します。これは、スクリプトがHTMLレンダリングをブロックしないように、ページの最後にexternaスクリプトをロードする理由の1つです。

+0

OK、スクリプトをどこに置くかについては、上部または下部:

、パーサーはdivを解析するためにスクリプトがロードされるのを待つでしょうか? YSlowはスクリプトを一番下に置くことを提案していますが、このルールに従わないBIGのウェブサイトはすべて表示されます。いつ、どのようなスクリプトを私は底に置くべきですか? – kae

+1

まず、スクリプトがロードされて実行され、divが解析されます。あなたの側を正しく表示する必要がないすべてのスクリプトは、あなたの側の最後にロードする必要があります。 –

0

は属性deferまたはasync

のブラウザを使用しなくてもハンドリングのより伝統的な方法についての話をします以下となります。解析

  • をダウンロードするから、他のリソースをブロック

    1. ダウンロードscript秒、スクリプト

    2. スクリプト

    参照Ch1のを実行し、ロードとHigh Performance JavaScript

    から実行するには、ここで別の良いリファレンス12.3です。 JavaScriptプログラムの実行JavaScript: The Definitive Guide, 4th Edition