0

本文の最後に3つの外部jsファイルを含めました。私のドキュメントにinsertlibs.jsという名前のjsがすでに含まれていると仮定し、ここにコードがあります

var script1 = document.createElement('script');
script1.src='http://code.jquery.com/jquery-latest.js';
script1.type='text/javascript';
document.getElementsByTagName('Body').item(0).appendChild(script1);

// Similar way to include underscore

var script2 = document.createElement('script');
script2.src='hhttp://documentcloud.github.com/backbone/backbone-min.js';
script2.type='text/javascript';
document.getElementsByTagName('Body').item(0).appendChild(script2);  

しかし、時々起こっていることは、$が定義されていないというエラーをスローし、Firefoxでデバッグしようとしましたが、jqueryとバックボーンの並列ダウンロードが発生し、バックボーンライブラリがjQueryよりも早くダウンロードされることがあります。これがこのエラーの原因です。

私が知っている限り、スクリプトタグが含まれていると、それ以上のリクエストがブロックされます。したがって、domにjqueryを追加するとすぐに。私はここで起こっているワークフローについて混乱しています。

だから私は解決策を見つけました、私はjsと完全に機能している単一の呼び出しの両方をマージしましたが、それは私に上記の場合に起こっている流れを説明していません。助けてください。

4

2 に答える 2

5

これは、jqueryが完全にロードされていることを確認せずにバックボーンをインクルードしようとしているためです。これを修正するには、スクリプトのonload属性を使用して、jqueryがロードされたときに発生するコールバックをアタッチできます。

例:

var script1 = document.createElement('script');
script1.src='http://code.jquery.com/jquery-latest.js';
script1.type='text/javascript';

// add an onload handler
script1.onload = function() {

   // load the rest of the scripts here

   var script2 = document.createElement('script');
   script2.src='hhttp://documentcloud.github.com/backbone/backbone-min.js';
   script2.type='text/javascript';
   document.getElementsByTagName('Body').item(0).appendChild(script2);
}

document.getElementsByTagName('Body').item(0).appendChild(script1);
于 2012-10-24T17:26:59.713 に答える
1

スクリプトタグが含まれている場合、それ以上のリクエストはブロックされます。

いいえ、ブロック/同期ダウンロードは、タグが解析されたHTMLに正しく含まれている場合(またはdocument.write解析中に経由で挿入された場合)のみです。動的にDOMが追加されたスクリプトは、非同期かつ並列にロードされます。

これを行うには、依存関係が満たされたときにスクリプトが確実に実行されるようにするには、AMDローダーを使用する必要があります。

于 2012-10-30T11:27:54.523 に答える