Secara umum, jika semua kode JavaScript yang diperlukan dimuat sekaligus, halaman web awal akan melambat, tetapi banyak kode yang dimuat tidak perlu digunakan, dan limbah kinerja yang tidak perlu ini harus dihindari. Jika Anda ingin memuat kode JavaScript secara dinamis, Anda dapat menggunakan model DOM untuk menambahkan node <script> dalam dokumen HTML dan mengatur atribut SRC dari simpul ini (mis., File JavaScript Outreach) ke kode JavaScript yang perlu dimuat secara dinamis.
Berikut adalah contoh menyelesaikan fungsi seperti itu:
(1) Buat file jsloaderTest.html baru
<html xmlns = "http://www.w3.org/1999/xhtml"> <adept> <meta http-equiv = "tipe konten" konten = "teks/html; charset = gb2312"/<title> contoh memuat kode javascript; Jsloader () {this.load = function (url) {// Dapatkan semua <script> tag var ss = document.geteLementsbyTagname ("script"); // uji apakah file yang ditentukan telah dimasukkan. Jika telah dimasukkan, memicu acara OnSuccess dan kembali untuk (i = 0; i <ss.length; i ++) {if (ss [i] .src && ss [i] .src.indexof (url)! =-1) {this.onsuccess (); kembali; }} // Buat node skrip dan atur atributnya ke file javascript penjangkauan s = document.createElement ("script"); s.type = "Teks/JavaScript"; s.src = url; // Dapatkan head node dan masukkan <script> ke var head = document.geteLementsByTagname ("head") [0]; head.AppendChild (s); // Dapatkan referensi Anda sendiri var self = ini; //For IE browser, use the readystatechange event to determine whether the load is successful//For other browsers, use the onload event to determine whether the load is successful//s.onload=s.onreadystatechange=function(){ s.onload=s.onreadystatechange=function(){ //In this function, this pointer refers to the s node object, not the JsLoader instance, //So you must use self to call the Acara OnSuccess, sama di bawah ini. if (this.readystate && this.readystate == "muat") return; self.onsuccess (); } s.onError = function () {head.removechild (s); self.onfailure (); }}; // Tentukan peristiwa sukses pemuatan this.onsuccess = function () {}; // Tentukan peristiwa gagal this.onfailure = function () {}; } function btnclick () {// Buat objek var jsloader = jsloader baru (); // Tentukan pawang Success JSLoader.onsuccess = function () {sayhello (); } // Tentukan handler kegagalan pemuatan JSLoader.onfailure = function () {alert ("File Loading Gagal!"); } // Mulailah memuat jsloader.load ("hello.js"); } </script> </head> <body> <label> <input type = "kirim" name = "kirim" ontClick = "javaScript: btnclick ()" value = "memuat file javascript"> </label> </body> </html>(2) Buat file Hello.js baru, termasuk kode berikut:
// fungsi dokumen javascript sayshello () {alert ("Hello World! Berhasil memuat file javascript"); } // JavaScript DocumentFunction Sayshello () {alert ("Hello World! Berhasil Memuat File JavaScript"); }