In IE6/7 hindert JavaScript die Seite mit zwei Aspekten:
Die Webseitenressourcen unter dem Skript -Tag werden nicht mehr anfordern und heruntergeladen, bevor das Skript geladen wird.
Das HTML -Element unter dem Skript -Tag wird nicht mehr rendern, bevor das Skript geladen wird.
In IE6/7 Firefox2/3 Safari3 Chrome1 und Opera behindern Skript -Tags das Herunterladen:
Obwohl das Skript unter IE8, Safari4 und Chrome2 gleichzeitig gleichzeitig sein kann, behindert es immer noch den Download anderer Ressourcen:
Es gibt 6 Möglichkeiten, das Skript parallel zu anderen Ressourcen herunterzuladen:
1.xHR Eval - Skript über XHR (XMLHTTPREQUEST -Objekt) herunterladen und dann die Evaly -Methode verwenden, um XHRs Responsext auszuführen
2.xHR -Injektion - Das Skript über XHR herunterladen, dann ein Skript -Tag erstellen und in das Dokument (Körper- oder Kopf -Tag) einfügen und dann das Textattribut des Skript -Tags auf den Wert von XHRs Antwort festlegen
3.xhr in iframe - Stecken Sie das Skript -Tag in einen Iframe und laden Sie es durch den Iframe herunter
4.Script DOM -Element - Erstellen Sie ein Skript -Tag und richten Sie auf sein SRC -Attribut auf Ihre Skriptadresse hin
5.Script Defer - Fügen Sie das Defer -Attribut des Skript -Tags hinzu. Dies gilt nur in IE, aber Firefox3.1 unterstützt auch dieses Attribut.
6. Verwenden Sie die Dokument.
Sie können die Verwendungsbeispiele jeder Methode durch Cuzillion anzeigen.
Wenn es einige Inline -Skripte gibt, die nach Ausführung externer Skripte ausgeführt werden müssen, müssen sie synchronisiert werden. Als "Kopplung" bezeichnet und asynchrone Skripte in diesem Artikel gekoppelt werden einige Methoden, die derzeit "Kopplung" implementieren können.
Headjs kann es ermöglichen, JS gleichzeitig herunterzuladen (aber nacheinander ausführen): http://headjs.com/
Die Codekopie lautet wie folgt:
head.js ("/path/to/jquery.js", "/google/analytics.js", "/js/site.js", function () {
// alles fertig
});
// der einfachste Fall. Laden und führen Sie ein einzelnes Skript aus, ohne zu blockieren.
head.js ("/path/to/file.js");
// laden ein Skript und führen Sie eine Funktion aus, nachdem es geladen wurde
head.js ("/path/to/file.js", function () {
});
// Dateien parallel laden, aber sie nacheinander ausführen
head.js ("Datei1.js", "file2.js", ... "filen.js");
// Funktionen ausführen, nachdem alle Skripte geladen wurden
head.js ("Datei1.js", "file2.js", function () {
});
// Dateien werden parallel geladen und ausgeführt, damit sie ankommen
head.js ("file1.js");
head.js ("file2.js");
head.js ("file3.js");
// Der vorherige kann auch als geschrieben werden als
head.js ("file1.js"). js ("file1.js"). js ("file3.js");