Wie variieren die Lade- und Ausführungsreihenfolge von JavaScript-Skripten zwischen Inline-, externen, asynchronen, verzögerten und dynamisch hinzugefügten Skripten?

Verstehen der Lade- und Ausführungsreihenfolge von JavaScript-Skripten

Die Ausführungsreihenfolge von JavaScript auf Webseiten kann aufgrund verschiedener Möglichkeiten zur Einbindung externer Skripte und dynamischer Skriptergänzung komplex sein. Um die Feinheiten zu verdeutlichen, schauen wir uns die Lade- und Ausführungsreihenfolge von JavaScript-Skripten anhand verschiedener Szenarien an:

Inline vs. externe Skripte

Unabhängig davon, ob es sich um Inline-Code oder ein geladenes externes Skript von handelt Wenn Sie einen URI angeben, werden Skripte beim Parsen in der Reihenfolge ihres Erscheinens auf der Seite ausgeführt. Daher warten Inline-Skripte nach externen Skripten darauf, dass diese externen Skripte geladen und ausgeführt werden.

Asynchrone Skripte

Asynchrone Skripte, die mit dem Attribut „async“ gekennzeichnet sind, werden in einer unvorhersehbaren Reihenfolge ausgeführt. Der Browser lädt sie parallel und führt sie ohne Rücksicht auf die Reihenfolge aus.

Defer-Skripte

Defer-Skripte mit dem Defer-Attribut werden geladen, aber gehalten, bis die Analyse abgeschlossen ist. Anschließend werden sie in der angegebenen Reihenfolge ausgeführt, wobei die Abhängigkeiten zwischen verzögerten Skripten erhalten bleiben.

Dynamisch hinzugefügte Skripte

Das dynamische Skripteinfügungsverhalten variiert je nach Browser. Beispielsweise setzt Firefox dynamisch hinzugefügte Skript-Tags standardmäßig auf „async“, sofern nicht anders angegeben. Asynchrone Skripte können sofort oder nach dem Parsen ausgeführt werden.

Ausführungsreihenfolge

Unter Berücksichtigung des oben Gesagten ist die Ausführungsreihenfolge für das in der ursprünglichen Frage beschriebene Szenario wie folgt:

• Initialisierung und Laden von Skripten im (in der angegebenen Reihenfolge laden und ausführen)
• Erstes Inline-Skript im lädt ein Skript dynamisch (erscheint nach den externen Skripten im )
• Zweites Inline-Skript im verlässt sich auf das dynamisch geladene Skript
• Das dynamisch geladene externe Skript wird parallel geladen und ausgeführt (unvorhersehbare Reihenfolge)
• Das zweite Inline-Skript wird erst ausgeführt, nachdem das dynamisch geladene Skript erfolgreich ausgeführt wurde. Dies liegt daran, dass Browser die Ausführung von Skripten im Allgemeinen in der Reihenfolge ihres Auftretens priorisieren.

Das obige ist der detaillierte Inhalt vonWie variieren die Lade- und Ausführungsreihenfolge von JavaScript-Skripten zwischen Inline-, externen, asynchronen, verzögerten und dynamisch hinzugefügten Skripten?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!