Ich baue meine Lazy Loader-Modul zu akzeptieren asyncronus Anfrage, aber ich habe ein großes Problem:
Der Internet Explorer unterstützt script.onload/onerror nicht!!!
Das alte Skript wertete die mit einem Ajax-Sync-Aufruf gelesene Zielskriptquelle global aus, es funktioniert sehr gut, es ist Cross-Browser und ich kann es async Bearbeitung 1 Variable machen, aber es ist sehr schwierig zu debuggen (ALLE der Quellcode in einer einzigen Zeile ausgeführt wird und der Browser gibt nicht zu viele Informationen über die Fehler, teilen den Code von Zeile mit einem regexp ist UNMÖGLICH, weil js Blöcke mit unendlicher Tiefe haben und regexp sind einfach nicht gut auf diese).
Dies ist der Code, den ich zur Erstellung des Skripts (ein Klassiker) verwende:
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>;es wird nicht auf IE funktionieren, weil es onload und onerror mit dem Skript nicht unterstützt;
der folgende Code ist eine Lösung, funktioniert aber nur, wenn das Skript nicht asynchron ist
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>;
};Ich kann es alle X Millisekunden testen, bis das Skript geladen ist, aber es ist eine hässliche Lösung und ich möchte es vermeiden.
EDIT: Dies ist der Code, den ich versucht habe, alle X ms zu überprüfen, ob das Skript geladen ist, es ist nicht so schlecht und es funktioniert besser als Ajax; das Problem ist, dass ich nicht wissen kann, ob das Skript mit Erfolg oder mit Fehler (onload oder onerror) geladen wird.
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);Ich habe versucht, addEventListener/attachEvent-Funktionen zu verwenden, aber es scheint nicht zu funktionieren (auch nicht mit addEvent-Funktionen aus dem Web)
Die Zusammenfassung der Optionen scheint zu sein:
- Verwendung von AJAX und global eval zum Laden des Skripts (Debugging Hölle)
- AJAX und Global Eval nur mit IE verwenden (kann eine Lösung sein, ich benutze IE nicht)
- AJAX und global eval nur verwenden, wenn das Skript Fehler enthält (ich muss Timing-Probleme überprüfen, weil ich mit meinem Code syncronous Code "simuliere", auch wenn der Aufruf async ist)
- Test script.onreadystatechange (nur auf IE) jedes X-mal, bis es geladen ist (UGLY!!!)
- Verwenden Sie window.onload : AVOID, es muss die gesamte Seite laden, ich muss es aufrufen, wenn NUR ein Skript gestartet wird (siehe Details auf der Endseite)
- Fügen Sie einen Code in die Quelle jedes Skripts ein (AVOID wie auf der Endseite beschrieben)
- script.onload für IE reparieren (mit addEventListener/attachEvent?!?)
BITTE BEACHTEN SIE:
Ich möchte nicht window.onload verwenden, weil es nur ausgelöst wird, wenn ALLE die Seite geladen ist, muss ich es auslösen, wenn nur das Ziel-Skript geladen wird (mein Lazy-Loading-Skript ist viel komplexer, also bitte nicht fragen, warum);
Ich möchte KEINE Bibliothek von Drittanbietern (wie Jquery, Prototype usw.) verwenden. ,
Ich möchte nicht einmal den Quellcode des Zielskripts bearbeiten (wie bei der Verwendung von JSPON oder dem Hinzufügen eines Skripts, das darauf hinweist, dass das Skript geladen ist).
Ich hoffe, das ist nicht zu viel! Danke!
