ホームページ >ウェブフロントエンド >jsチュートリアル >js_javascriptスキルを動的にロードする方法のまとめ
js_javascriptスキルを動的にロードする方法のまとめ
- WBOYオリジナル
- 2016-05-16 16:14:20918ブラウズ
この記事の例は、js を動的にロードする方法をまとめたものです。皆さんの参考に共有してください。詳細は以下の通りです。
方法 1: 直接 document.write (非同期)
コードをコピーします コードは次のとおりです。
");
このメソッドは非同期ロードであるため、document.write はインターフェースを書き換えますが、これは明らかに実用的ではありません
方法 2: 既存のスクリプトの src 属性を動的に変更する (非同期)
コードをコピー コードは次のとおりです:
このメソッドはインターフェイス要素を変更したり、インターフェイス要素を書き換えたりしませんが、非同期的にロードされます 方法 3: スクリプト要素を動的に作成する (非同期)
コードをコピー コードは次のとおりです:<script></div>
var body= document.getElementsByTagName('BODY').[0];
var script= document.createElement("script");
Script.type = "テキスト/javascript" <div class="codebody" id="code52191">
Script.src="xx.js";
body.appendChild(oScript);
</script>
2 番目の方法と比較したこの方法の利点は、最初にインターフェイスに script タグを記述する必要がないことです。欠点は、非同期ロードであることです。
方法 4: XMLHttpRequest/ActiveXObject の読み込み (非同期)
コードをコピー2 番目の方法と比較したこの方法の利点は、最初にインターフェイスに script タグを記述する必要がないことです。欠点は、非同期ロードであることです。
方法 4: XMLHttpRequest/ActiveXObject の読み込み (非同期)
コードは次のとおりです: