いつjavascript関数が実行されるのですか

Question

私はそれは簡単な質問でなければならないと思っていますが、私は周りを探し回っていて、答えはどこにも見つかりませんでした。

と思うが、私はこのような（体で）いくつかのスクリプトでHTMLページを持っていることです。

<script type="text/javascript">grf();</script> 

GRF（）関数は、外部の.jsファイルに定義されています。 問題は、ブラウザがページとそのすべての外部jsファイルをロードした後にこの関数が実行されることですか？または、.jsファイルがロードされる前に関数が実行されることもあります。もしそうなら、どうすればこれを防ぐことができますか？

Answer 1

そこに実行可能なコード）。

したがって、外部ファイルが 'インクルード'された後に外部ファイルで関数を呼び出すと、関数定義されていないエラーは生成されません。 （ただし、その外部関数がDOMやDOM内に存在しない要素を操作しようとすると、エラーが発生することに注意してください）。

Answer 2

このメソッドは、ブラウザがページをロードするときに、<script>ブロックの最後に到達すると実行されます。外部JSファイルが、このメソッドが呼び出された場所よりもさらに下にページに含まれていると、エラー（定義されていないメソッド）がスローされます。

ページとアセットが読み込まれるまで待つ場合は、ライブラリを使用することをお勧めします。組み込みのonloadイベントの使用は限られています。ハンドラを1つ追加するだけです（別のハンドラを追加すると、前のものを上書きする）。ここでjQueryを使用した例です：

<script type="text/javascript"> 
$(document).ready(function() { 
    //code goes here 
    }); 
</script> 

Answer 3

、それが発生したときに関数が実行されます。ページがロードされた後に実行したい場合、標準的な方法はウィンドウのonloadイベントをフックすることです。 jQueryのは、このために素晴らしいサポートを持っていますが、地上レベルで始めることができます：ほとんどの人がjQueryを使用する理由

<script type="text/javascript">window.onload = function() { grf(); }</script> 

これはページ上で以前に割り当てられていること以外のonloadイベントハンドラで踏みつけるます

は慎重です前のハンドラにチェーンに：この第二の例のために当然のことながら

<script type="text/javascript">$(document).ready(function() { grf(); });</script> 

、あなたは（あなたがする立場にないているように聞こえる）ページまでさらにjQueryのライブラリを含める必要があります。

Answer 4

ブラウザはタグを見ると実行します。他のスクリプトはまだ読み込まれていないだけでなく、DOMが構築されていない可能性があります。ただし、スクリプトがHTMLに表示されるように実行されることが保証されています。

jQueryを使用できる場合は、$ .ready（）関数が用意されています。これは、DOMが準備されているのですべてのスクリプトが既に読み込まれているときにコールバックを呼び出します。

$.ready(grf); 

のように使用するか、一般的に使用されている匿名機能を使用してください。

Answer 5

スクリプトの問題を防ぐ最も良い方法は、すべてのコードがさまざまなイベント（dom.readyなど）にバインドされるようにjQuery、MootoolsなどのJavaScriptライブラリを使用することです。 。

Answer 6

スクリプトファイルが関数使用法の上に含まれている限り、その関数が利用可能になります。ブラウザは、

<script src="..."></script> 

タグに出会うとレンダリングを停止します。スクリプトがダウンロードされて解析されるときにのみ、ドキュメントページの処理が再開されます。これは、常に、実際に必要な動作ではありません

<script src="..."></script> <!-- Browser waits until this script is loaded --> 
<script> 
    foo(); // if function foo was in the script above, it is ALWAYS available now 
</script> 

- 時々あなたはそれがあなたのコードが遅いように見えることがありとしてダウンロードするためのスクリプトを待つ必要はありません。だから、スクリプト内で定義された任意の関数は、後に右利用できるようになります。 1つの方法は、すべてのスクリプトがロードされ、すべてのHTMLが既にレンダリングされているときに</body>の前にページの最後に実行することです。外部スクリプトが発見された場合

// functions are defined or undefined just like regular variables 
function myFunc() { 
    /*--code here--*/ 
} 

// So we just need to see if it's defined 
if(myFunc) { 
    /*--do something here--*/ 
} else { 
    /*--wait, retry or w/e--*/ 
} 

、（X）HTMLは、どのがある場合は、外部スクリプトを読み取る（およびコードが内部で実行され、さらに、それまでは読み込まれません。関数が定義されているかどうかを確認するために