ホームページ  >  記事  >  ウェブフロントエンド  >  js_javascriptスキルを動的にロードする方法のまとめ

js_javascriptスキルを動的にロードする方法のまとめ

WBOY
WBOYオリジナル
2016-05-16 16:14:20897ブラウズ

この記事の例は、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 の読み込み (非同期)

コードをコピー


コードは次のとおりです:
/**
* js スクリプトを非同期でロードします
* @param id 設定する必要がある