Artikel ini menjelaskan solusi untuk pembuatan skrip yang tidak valid. Tag onload secara dinamis di IE8. Bagikan untuk referensi Anda. Analisis spesifiknya adalah sebagai berikut:
Hari ini, ketika saya sedang mengerjakan proyek, saya menemukan masalah aneh. Tag skrip yang dibuat secara dinamis tidak dapat memicu acara Onload di bawah IE8.
Kodenya adalah sebagai berikut:
Salin kode sebagai berikut: var loadjs = function (src, fun) {
var skrip = null;
Script = Document.CreateElement ("Script");
script.type = "Teks/JavaScript";
script.src = src;
if (typeof fun === "fungsi") {
script.onload = fun;
}
document.getElementsbyTagname ("head") [0] .AppendChild (skrip);
};
loadjs ("js/jQuery-1.11.0.min.js", function () {
Console.log ("From JQuery");
});
loadjs ("test.js", function () {
console.log ("from test.js");
});
test.js:
console.log (tipe jQuery);
Hasil Menjalankan:
Salin kode sebagai berikut: Tidak ditentukan // Saat test.js berjalan, jQuery belum dimuat
>> typeof jQuery // jalankan dari konsol, tetapi menemukan objek jQuery, membuktikan masalah pesanan pemuatan
"fungsi"
Selain itu, skrip.onload tidak dieksekusi dalam kode di atas. Kode telah dimuat, jadi mengapa masih belum dieksekusi? Setelah memeriksa secara online, saya menemukan bahwa banyak pengembang front-end mengalami masalah sulit ini, jadi saya menemukan beberapa alternatif, sebagai berikut:
Salin kode sebagai berikut: var loadjs = function (src, fun) {
var skrip = null;
Script = Document.CreateElement ("Script");
script.type = "Teks/JavaScript";
script.src = src;
if (typeof fun === "fungsi") {
Script.onReadyStateChange = function () {
var r = script.readystate;
console.log (src + ":" + r);
if (r === 'dimuat' || r === 'complete') {
script.onreadystatechange = null;
seru();
}
};
}
document.getElementsbyTagname ("head") [0] .AppendChild (skrip);
};
Hasil Eksekusi:
Salin kode sebagai berikut: Tidak ditentukan
JS/JQuery-1.11.0.min.js: Memuat
test.js: Lengkap
Dari test.js
JS/JQuery-1.11.0.min.js: dimuat
Dari jQuery
Langkah eksekusi adalah, fungsi yang mirip dengan Onload telah ditemukan, tetapi ada masalah. Itu tidak dimuat secara berurutan. Ketika file jQuery memuat, test.js telah selesai, dan baris pertama dieksekusi terlebih dahulu. Karena test.js dieksekusi sebelum jQuery, tidak ditentukan dibuat. Jadi kita bisa menulis ulang seperti ini dan membiarkannya memuat secara linear:
Salinan kode adalah sebagai berikut: loadjs ("JS/JQuery-1.11.0.min.js", function () {
Console.log ("From JQuery");
loadjs ("test.js", function () {
console.log ("from test.js");
});
});
Hasil Eksekusi:
Salin kode sebagai berikut: JS/JQuery-1.11.0.min.js: Memuat
JS/JQuery-1.11.0.min.js: dimuat
Dari jQuery
fungsi
test.js: Lengkap
Dari test.js
Kali ini, perintah eksekusi persis dalam urutan yang kami pesan, tetapi kode di atas terlihat canggung dan perlu bersarang lapisan demi lapisan, jadi saya menemukan metode penulisan ini lagi:
Salin kode sebagai berikut: var loadjs = function (src, fun) {
var skrip = null;
Script = Document.CreateElement ("Script");
script.type = "Teks/JavaScript";
script.src = src;
if (typeof fun === "fungsi") {
Script.onReadyStateChange = function () {
var r = script.readystate;
console.log (src + ":" + r);
if (r === 'dimuat' || r === 'complete') {
script.onreadystatechange = null;
seru();
}
};
}
document.write (script.outerHtml);
//document.getElementsByTagname("Head")) 000.AppendChild(script);
};
loadjs ("js/jQuery-1.11.0.min.js", function () {
Console.log ("From JQuery");
});
loadjs ("test.js", function () {
console.log ("from test.js");
});
Urutan hasil eksekusi juga berbeda:
Salin kode sebagai berikut: Fungsi
JS/JQuery-1.11.0.min.js: dimuat
Dari jQuery
test.js: dimuat
Dari test.js
Jika Anda mengubah pesanan pemuatan
Salinan kode adalah sebagai berikut: loadjs ("test.js", function () {
console.log ("from test.js");
});
loadjs ("js/jQuery-1.11.0.min.js", function () {
Console.log ("From JQuery");
});
Hasil eksekusi berbeda, dimuat sama secara berurutan:
Salin kode sebagai berikut: Tidak ditentukan
test.js: dimuat
Dari test.js
JS/JQuery-1.11.0.min.js: dimuat
Dari jQuery
Saya harap artikel ini akan membantu pemrograman JavaScript semua orang.