JS_javascript スキルでスクリプトを動的にロードする 4 つの方法

WBOY

リリース： 2016-05-16 18:53:25

オリジナル

1149 人が閲覧しました

js ファイルが比較的小さい場合は、接続数を減らすことができる 1 つの js ファイルを使用することをお勧めします。一般的に使用される方法は次の 4 つです。最後に、Script House が推奨する方法を 1 つ紹介します。
1. 直接 document.write

コードをコピーコードは次のとおりです:

"); script>

2. 既存のスクリプトの src 属性を動的に変更します

コードをコピーします> コードは次のとおりです。

3. スクリプト要素を動的に作成します。 >

コードをコピーします
コードは次のとおりです。

これらの 3 つのメソッドはすべて非同期で実行されます。つまり、これらのスクリプトのロード中に、メイン ページは引き続き実行されます。上記の方法を使用した場合、次のコードは期待した効果を発揮しません。 

動的にロードされる JS スクリプト: a.js、以下はファイルの内容です

コードをコピーします

コードは次のとおりです:

var str = "中国"; alert( "これは a.js の変数です: " str );ページコード: コードをコピー

コードは次のとおりです:

上記のコードが実行されると、a.js のアラートが実行され、メッセージがポップアップ表示されます。
ただし、メインページでエラーが発生し、ダイアログボックスは表示されません。理由は、「str」が未定義であるためです。メインページで str を取得するときに、a.js が完全に正常にロードされていないためです。スクリプトを同期的に実行する必要がある場合は、以下の 4 番目の方法を使用できます。

4. 原則: XMLHTTP を使用してスクリプト化するコンテンツを取得し、Script オブジェクトを作成します。

注: エラーを避けるために、a.js は UTF8 エンコーディングで保存する必要があります。サーバーと XML はデータの送信に UTF8 エンコーディングを使用するためです。
メインページのコード:

コードをコピー

コードは次のとおりです:

现在完成了一个JS脚本的动态加载。
复制代码代码如下:

var Rash=true;
var msg="";
function norash()
{
if (confirm("确定要取消吗"))
Rash=false;
}
function rashit()
{
setInterval('getrss()',Inttime);
}
function getrss()
{
if (Rash==true)
{
head=document.getElementsByTagName('head').item(0);
script=document.createElement('script');
script.src='INCLUDE/AutoUpdate.asp';
script.type='text/javascript';
script.defer=true;
void(head.appendChild(script));
window.status=msg;
}
}
rashit();

注意文字加粗的地方，大家可以情况选择。