2013-05-18 13 views
8

HTML文書(例:本文)にインラインのJavascriptコードがあると仮定すると、このJavascriptは常にJQueryの文書対応コードの前に実行されますか?はインライン/ブロックですドキュメントの準備が整う前にJavascriptが実行されていますか?

たとえば、次のような安全なものはありますか?

... 
<body> 
    <script type="text/javascript"> 
     var myVar = 2; 
    </script> 
    ... 
</body> 

... 
$(document).ready(function() { 
    alert('My Var = ' + myVar); 
} 

ない場合、どのように私はmyVarがインライン/ブロックコードで定義されている知って、それが安全にすることができますか?

答えて

10

はい、上記のコードは安全です。インラインJSは、ドキュメントが上から下に解析されている間に実行されます。ドキュメント準備完了ハンドラは、ドキュメントが準備完了(明らかに)されたときに実行され、インラインスクリプトを含むのすべてのドキュメントが解析されるまで準備ができません。

ドキュメント本体の最後のものとしてラップするコードを含める場合は、ドキュメントレディハンドラは実際には必要ありません。その時点で他のインラインJSだけが実行されるだけでなく、すべてのドキュメント要素がDOMに追加され、JSからアクセスできるようになります。

7

はい、HTMLが解析されている間にインラインJavaScriptが実行されます。

まだ解析されていないDOM要素(つまり、HTMLソースコード内のスクリプトブロックの後の要素)への参照を取得しない限り、これを行うのが安全です。以前のスクリプトブロックで定義された変数を参照することもできます(スコープ内にある限り)。

Matt Browneがコメントで指摘したように、DOMContentLoadedリスナー(またはoldIE回避策またはwindow.onload)を使用しないことも一般的には安全です閉じる</body>タグ。その時点で、すべてのHTML要素は既にDOM内にあります(無効なHTMLになる</body>以降の要素がない限り)。

+3

関連するノート: ''タグの直前にjQueryを使用するスクリプトを置く場合は、 '$(document).ready()'を使用しないでください。 –

+3

注釈についての注意:jQueryに依存するスクリプトは、jquery.jsを組み込んだ後にどこでもかまいません。しかし私たちは@MattBrowneの意味を理解しています。準備が整っているDOMに依存しているスクリプトは、準備完了のハンドラではなく、ボディの最後に置くことができます。 – nnnnnn

+0

@nnnは精度のために編集されました – bfavaretto

1

myVArには$(document).ready(function() {})からアクセスできます。

HTMLでコードを実行した場合、myVarwindow JSグローバルオブジェクト(つまりwindow.myVar)のプロパティになります。 jQuery関数でローカルに作成する必要はないと思います。

関連する問題