一般的に、必要なすべてのJavaScriptコードが一度にロードされた場合、最初のWebページは遅くなりますが、多くのロードされたコードを使用する必要はなく、この不必要なパフォーマンス廃棄物を避ける必要があります。 JavaScriptコードを動的にロードする場合は、DOMモデルを使用してHTMLドキュメントに<script>ノードを追加し、このノードのSRC属性（アウトリーチJavaScriptファイル）を動的にロードする必要があるJavaScriptコードに設定できます。
このような関数を完了する例は次のとおりです。
（1）新しいjsloadertest.htmlファイルを作成します
<html xmlns = "http://www.w3.org/1999/xhtml"> <head> <meta http-equiv = "content-type" content = "text/html; charset = gb2312"/> <タイトルjsloader（）{this.load = function（url）{// get All <script> tags var ss = document.getelementsbytagname（ "script"）; //指定されたファイルが含まれているかどうかをテストします。含まれている場合、onsuccessイベントをトリガーし、（i = 0; i <ss.length; i ++）{if（ss [i] .src && ss [i] .src.indexof（url）！= -1）{this.onsucs（）;戻る; }} //スクリプトノードを作成し、その属性をアウトリーチJavaScriptファイルs = document.createelement（ "script"）に設定します。 s.type = "text/javascript"; s.src = url; // headノードを取得し、<script>をvar head = document.getElementsbytagname（ "head"）[0]に挿入します。 head.AppendChild（s）; //独自の参照var self = thisを取得します。 // IEブラウザの場合、ReadyStateChangeイベントを使用して負荷が成功したかどうかを判断します//他のブラウザの場合、オンロードイベントを使用して、負荷が成功しているかどうかを判断します//以下と同じように、Onsuccessイベント。 if（this.readystate && this.readystate == "loading"）return; self.onsuccess（）; } s.onerror = function（）{head.removechild（s）; self.onfailure（）; }}; // loading success event this.onsuccess = function（）{}; //失敗したイベントを定義するthis.onfailure = function（）{}; } function btnclick（）{//オブジェクトの作成var jsloader = new jsloader（）; // Loading Success Handler jsloader.onsuccess = function（）{sayhello（）; } //ロード障害ハンドラーjsloader.onfailure = function（）{alert（ "ファイルの読み込み障害！"）; } // jsloader.load（ "hello.js"）の読み込みを開始します。 } </script> </head> <body> <label> <入力タイプ= "submit" name = "inclick =" javascript：btnclick（） "value =" javascript file "> </label> </body> </html> </html>（2）次のコードを含む新しいhello.jsファイルを作成します。
// javascriptドキュメント関数sayshello（）{alert（ "hello world！javascriptファイルに正常にロードされた"）; } // javascript documentfunction sayshello（）{alert（ "hello world！javascript file"）; }