HTMLScriptElement

Instanz-Eigenschaften

Erbt Eigenschaften von seinem Elternteil, HTMLElement.

HTMLScriptElement.attributionSrc Sicherer Kontext Veraltet

Ruft das Attribut attributionsrc auf einem <script>-Element programmgesteuert ab und setzt es, was den Wert dieses Attributs widerspiegelt. attributionsrc gibt an, dass Sie möchten, dass der Browser einen Attribution-Reporting-Eligible-Header zusammen mit der Skriptressourcenanforderung sendet. Auf der Serverseite wird dies verwendet, um das Senden eines Attribution-Reporting-Register-Source- oder Attribution-Reporting-Register-Trigger-Headers in der Antwort auszulösen, um eine JavaScript-basierte Attributionsquelle bzw. einen Attributionstrigger zu registrieren.

HTMLScriptElement.async

Ein boolescher Wert, der steuert, wie das Skript ausgeführt werden soll. Für klassische Skripte, wenn die async-Eigenschaft auf true gesetzt ist, wird das externe Skript parallel zum Parsen abgerufen und ausgeführt, sobald es verfügbar ist. Für Modulskripte, wenn die async-Eigenschaft auf true gesetzt ist, werden das Skript und alle seine Abhängigkeiten parallel zum Parsen abgerufen und ausgeführt, sobald sie verfügbar sind.

HTMLScriptElement.blocking

Eine Zeichenfolge, die angibt, dass bestimmte Vorgänge beim Abrufen des Skripts blockiert werden sollen. Sie spiegelt das blocking-Attribut des <script>-Elements wider.

HTMLScriptElement.charset Veraltet

Eine Zeichenfolge, die die Zeichenkodierung eines externen Skripts darstellt. Sie spiegelt das charset-Attribut wider.

HTMLScriptElement.crossOrigin

Eine Zeichenfolge, die die CORS-Einstellung für das Skriptelement widerspiegelt. Für klassische Skripte von anderen Ursprüngen steuert dies, ob Fehlerinformationen angezeigt werden.

HTMLScriptElement.defer

Ein boolescher Wert, der steuert, wie das Skript ausgeführt werden soll. Für klassische Skripte, wenn die defer-Eigenschaft auf true gesetzt ist, wird das externe Skript ausgeführt, nachdem das Dokument geparst wurde, aber bevor das DOMContentLoaded-Ereignis ausgelöst wird. Für Modulskripte hat die defer-Eigenschaft keine Wirkung.

HTMLScriptElement.event Veraltet

Eine Zeichenfolge; eine veraltete Methode zur Registrierung von Ereignishandlern auf Elementen in einem HTML-Dokument.

HTMLScriptElement.fetchPriority

Eine optionale Zeichenfolge, die dem Browser einen Hinweis gibt, wie er die Priorisierung des Abrufs eines externen Skripts im Verhältnis zu anderen externen Skripten handhaben sollte. Wenn dieser Wert angegeben wird, muss er einer der möglichen erlaubten Werte sein: high, um mit hoher Priorität abzurufen, low, um mit niedriger Priorität abzurufen, oder auto, um keine Präferenz anzugeben (was der Standard ist). Sie spiegelt das fetchpriority-Attribut des <script>-Elements wider.

HTMLScriptElement.innerText

Eine Eigenschaft, die den Inline-Textinhalt des <script>-Elements als gerenderten Text darstellt. Die Eigenschaft akzeptiert entweder ein TrustedScript-Objekt oder eine Zeichenfolge.

HTMLScriptElement.integrity

Eine Zeichenfolge, die Metadaten enthält, die ein Browser verwenden kann, um zu überprüfen, ob eine abgerufene Ressource ohne unerwartete Manipulation bereitgestellt wurde. Sie spiegelt das integrity-Attribut des <script>-Elements wider.

HTMLScriptElement.noModule

Ein boolescher Wert, der, wenn er auf true gesetzt ist, die Ausführung des Skripts in Browsern, die ES-Module unterstützen, stoppt — verwendet, um Fallback-Skripte in älteren Browsern auszuführen, die nicht JavaScript-Module unterstützen.

HTMLScriptElement.referrerPolicy

Eine Zeichenfolge, die das referrerPolicy-HTML-Attribut widerspiegelt und angibt, welcher Referer beim Abrufen des Skripts verwendet werden soll und bei Abrufen, die durch dieses Skript ausgeführt werden.

HTMLScriptElement.src

Ein TrustedScriptURL oder eine Zeichenfolge, die die URL eines externen Skripts darstellt; dies kann als Alternative zur direkten Einbettung eines Skripts in ein Dokument verwendet werden. Sie spiegelt das src-Attribut des <script>-Elements wider.

HTMLScriptElement.text

Eine Eigenschaft, die den Inline-Textinhalt des <script>-Elements darstellt. Die Eigenschaft akzeptiert entweder ein TrustedScript-Objekt oder eine Zeichenfolge. Sie funktioniert genauso wie die textContent-Eigenschaft.

HTMLScriptElement.textContent

Eine Eigenschaft, die den Inline-Textinhalt des <script>-Elements darstellt. Die Eigenschaft wird von Node neu definiert, um TrustedScript als Eingabe zu unterstützen. Auf diesem Element verhält sie sich genau wie die text-Eigenschaft.

HTMLScriptElement.type

Eine Zeichenfolge, die den Typ des Skripts darstellt. Sie spiegelt das type-Attribut des <script>-Elements wider.

Statische Methoden

HTMLScriptElement.supports()

Gibt true zurück, wenn der Browser Skripte des angegebenen Typs unterstützt, und false, andernfalls. Diese Methode bietet eine einfache und einheitliche Methode zur skriptbezogenen Feature-Erkennung.

Instanz-Methoden

Keine speziellen Methoden; erbt Methoden von seinem Elternteil, HTMLElement.

Ereignisse

Keine speziellen Ereignisse; erbt Ereignisse von seinem Elternteil, HTMLElement.

Beispiele

Dynamisches Importieren von Skripten

Lassen Sie uns eine Funktion erstellen, die neue Skripte in einem Dokument importiert, indem ein <script>-Knoten unmittelbar vor dem <script> erstellt wird, das den folgenden Code (über document.currentScript) enthält. Diese Skripte werden asynchron ausgeführt. Weitere Details finden Sie in den Eigenschaften defer und async.

function loadError(oError) {
  throw new URIError(`The script ${oError.target.src} didn't load correctly.`);
}

function prefixScript(url, onloadFunction) {
  const newScript = document.createElement("script");
  newScript.onerror = loadError;
  if (onloadFunction) {
    newScript.onload = onloadFunction;
  }
  document.currentScript.parentNode.insertBefore(
    newScript,
    document.currentScript,
  );
  newScript.src = url;
}

Diese nächste Funktion fügt, anstatt die neuen Skripte unmittelbar vor dem document.currentScript-Element hinzuzufügen, diese als Kinder des <head>-Tags hinzu.

function loadError(oError) {
  throw new URIError(`The script ${oError.target.src} didn't load correctly.`);
}

function affixScriptToHead(url, onloadFunction) {
  const newScript = document.createElement("script");
  newScript.onerror = loadError;
  if (onloadFunction) {
    newScript.onload = onloadFunction;
  }
  document.head.appendChild(newScript);
  newScript.src = url;
}

Beispiel zur Verwendung:

affixScriptToHead("myScript1.js");
affixScriptToHead("myScript2.js", () => {
  alert('The script "myScript2.js" has been correctly loaded.');
});

Überprüfen, ob ein Skripttyp unterstützt wird

HTMLScriptElement.supports() bietet einen einheitlichen Mechanismus zur Überprüfung, ob ein Browser bestimmte Skripttypen unterstützt.

Das folgende Beispiel zeigt, wie man die Unterstützung für Module überprüft, indem die Existenz des noModule-Attributs als Fallback verwendet wird.

function checkModuleSupport() {
  if ("supports" in HTMLScriptElement) {
    return HTMLScriptElement.supports("module");
  }
  return "noModule" in document.createElement("script");
}

Klassische Skripte werden auf allen Browsern als unterstützt angesehen.

Spezifikationen

Browser-Kompatibilität

Siehe auch

• HTML-<script>-Element
• HTML-<noscript>-Element
• document.currentScript
• Web Workers (Code Ausschnitte, die Skripten ähnlich sind, aber in einem anderen globalen Kontext ausgeführt werden)