Mengapa Peristiwa `onload` Tidak Menyala Apabila Melampirkan Elemen Skrip Menggunakan jQuery?

Masalah OnLoad Event dengan Tag Skrip

Dalam percubaan untuk memuatkan skrip dalam urutan, isu timbul apabila acara onload gagal dicetuskan . Coretan kod berikut menunjukkan masalah:

function loadScripts(scripts){
    var script = scripts.shift();
    var el = document.createElement('script');
    el.src = script;
    el.onload = function(script){
        console.log(script + ' loaded!');
        if (scripts.length) {
            loadScripts(scripts);
        }
        else {
            console.log('run app');
            MK.init();
        }
    };
    $body.append(el);
}

Acara onload tidak menyala apabila elemen skrip dilampirkan pada DOM menggunakan jQuery ($body.append(el)). Walau bagaimanapun, menggunakan JavaScript asli document.body.appendChild(el) mencetuskan acara seperti yang dimaksudkan.

Penyelesaian:

Untuk menyelesaikan isu ini, ubah suai kod seperti berikut:

function loadScripts(scripts){
    var script = scripts.shift();
    var el = document.createElement('script');
    $body.append(el);
    el.onload = function(script){
        console.log(script + ' loaded!');
        if (scripts.length) {
            loadScripts(scripts);
        }
        else {
            console.log('run app');
            MK.init();
        }
    };
    el.src = script;
}

Dengan melampirkan skrip pada DOM sebelum menetapkan atribut src, acara onload akan menyala sebagai dijangka. Selain itu, pertimbangkan untuk menggunakan kaedah getScript() jQuery untuk keserasian merentas pelayar.

Atas ialah kandungan terperinci Mengapa Peristiwa `onload` Tidak Menyala Apabila Melampirkan Elemen Skrip Menggunakan jQuery?. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!