Script onload / onerror with IE (for lazy loading) problems

Question

I am rebuilding my lazy bootloader module to accept an asyncronus request, but I have a BIG problem:
Internet Explorer does not support script.onload / onerror !!!

The old script made a global assessment of the target source of the script read using the ajax synchronization call, it works very well, it is a cross browser, and I can make it asynchronously edit 1 variable, but it is very difficult to debug (ALL the source code is executed on one line, and the browser gives not much error information, dividing the code into a line with a regular expression is IMPOSSIBLE because js has blocks with infinite depth, and the regular expression is simply not suitable for this).

This is the code I'm using to create a script (classic):

var script = document.createElement('script');
script.type = 'text/javascript';
script.src =name;
script.name =name;
script.async = true;
script.onload=<my_onload_code>;
script.onerror=<my_onerror_code>;

it will not work on IE because it does not support onload and onerror with a script.
the code below is a fix, but only works if the script is not async

if(script.onreadystatechange!==undefined)//only IE T_T
            script.onreadystatechange = function() {
                    if (script.readyState == 'loaded')//ERROR LOADING
                        <my_onerror_code>;
                    else
                    if(script.readyState == 'complete')//loaded
                        <my_onload_code>;

            };

I can test it every X milliseconds until the script loads, but this is an ugly solution, and I want to avoid it.

EDIT: this is the code I tried to check every X ms, if the script is loaded, it is not so bad and works better than ajax, the problem is that I can not know if the script was loaded successfully or with an error (onload or onerror )

var script = document.createElement('script');
script.type = 'text/javascript';
script.src =name;
script.name =name;
script.async = true;

    script.onload=function(){Lazy_loader.onload(this);};
    script.onerror=function(){Lazy_loader.onerror(this);};

    if(script.onreadystatechange!==undefined){//ie fix T_T 
        script.timer=setInterval(function(){
                    if (script.readyState == 'loaded' || script.readyState == 'complete')}//ERROR LOADING

                        if(LOADED???)//loaded
                            Lazy_loader.onload(script);
                        else
                            Lazy_loader.onerror(script);

                        clearInterval(script.timer);
                    }

                    },100);

    }

document.getElementsByTagName('head')[0].appendChild(script);

I tried using addEventListener / attachEvent functions, but it didn't seem to work (even using addEvent functions from the Internet)

A summary of the parameters is as follows:

• Use AJAX and global eval to load the script (debug hell)
• AJAX eval IE ( , IE)
• AJAX , script ( , "" , )
• script.onreadystatechange( IE) X (UGLY!!!)
• window.onload: AVOID, , , script (. )
• script (AVOID, )
• script.onload IE ( addEventListener/attachEvent?!?)

---

PLEASE NOTE:
I do not want to use window.onload because it only starts when ALL the page loads, I need to run it when only the target script loads (my lazy loading of the script is much more complicated, so please ask why),
I I DO NOT WANT to use any third-party library (for example, jquery, prototype, etc.) ,
I don’t even want to edit the target script source (for example, when using JSPON or adding a script to notify the script is loading).

Hope not too much! Thank.

Answer 1

: IE, async, script.text . , IE onload onerror ( ?), script.text( XSS, , iframes), , Microsoft , "", .

    var script = document.createElement('script');
    script.type = 'text/javascript';      
    //---start IE fix--- 
    if(window.ActiveXObject){//ie fix T_T 
            var xmlhttp=null;
            try {
                xmlhttp = new XMLHttpRequest();
            }catch(e){
                try{
                    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
                }catch(e){
                    xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
                }
            }  
            xmlhttp.onreadystatechange  = function() {
            try{
                if(this.done!==undefined)
                    return;

                if(this.status >= 200 && this.status < 300){//loaded
                    this.done=true;
                    script.text=this.responseText;
                    document.getElementsByTagName('head')[0].appendChild(script);
                    Lazy_loader.onload({name:name});
                }
                if(this.status >= 400){
                    this.done=true;
                    Lazy_loader.onerror({name:name});
                    }
                }catch(e){}
            };
            xmlhttp.open('get',name,true);                             
            xmlhttp.send(null); 

        }
        else{//browser that support script.onload/onerror
            script.src =name;
            script.name =name;
            script.async = true;  
            script.onload=function(){Lazy_loader.onload(this);};
            script.onerror=function(){Lazy_loader.onerror(this);};
            document.getElementsByTagName('head')[0].appendChild(script); 
        }
        //---end IE fix---

(IE/chrome/firfox ), 3- :

• file1 4
• file2 500
• file3 1s

40XX ( onload/onerror script), ( script) .

, , ! !

Answer 2

script.onreadystatechange = function() {
    if (script.readyState == 'loaded')//ERROR LOADING
        <my_onerror_code>;
    else if(script.readyState == 'complete')//loaded
        <my_onload_code>;

};

, , async , readyState = 'loaded' . , loaded , script, script.

src , readyState.

Answer 3

. , . , www.requirejs.org

, include import, js.

goofball, , , , .

var url = load_obj.url;
var callback  = load_obj.callback;
var head = document.getElementsByTagName('head')[0];
var appendage;
var complete = false;

appendage = document.createElement('script');
appendage.type = 'text/javascript';
appendage.onload = appendage.onreadystatechange = function() {
if (!complete && (!this.readyState || this.readyState === 'complete' || (this.readyState === 'loaded' && this.nextSibling != null))) {
    console.log('loaded via all');
    complete = true;
    if (callback)
        callback();
    //remove listeners
    appendage.onload = appendage.onreadystatechange = null;
} else if (this.readyState === 'loaded' && this.nextSibling == null) {
    console.log('error via ie');
}
appendage.onerror = function() {
    console.log('error via everything else');
}
appendage.src = url;

, , nextSibling null 404'd, js url , nextSibling .

Answer 4

Try the following: fooobar.com/questions/522808 / ... . This describes the problem for IE7-8 with the onerror event and shows the solution.