SVGScriptElement.type — Eigenschaft · JavaScript-Referenz

Signatur

SVGScriptElement.type

Beschreibung

Die Eigenschaft type der Schnittstelle SVGScriptElement gibt den Wert des type-Attributs eines <script>-Elements innerhalb eines SVG-Dokuments zurück. Das Attribut legt fest, in welcher Skriptsprache der Inhalt geschrieben ist, z. B. text/javascript, application/ecmascript oder module.

Die Eigenschaft ist ein reflektierendes Attribut: Sie liefert genau die Zeichenkette, die im Markup steht. Sie normalisiert nichts und prüft nicht, ob der Typ gültig ist. Fehlt das Attribut, gibt sie eine leere Zeichenkette "" zurück. Der Browser behandelt das Skript in diesem Fall als JavaScript.

Typische Einsatzfälle: Werkzeuge, die SVG-Dateien untersuchen oder bereinigen (z. B. alle Skripte mit Nicht-JavaScript-Typ finden), Debugging von eingebetteten Skripten und die Unterscheidung zwischen ausführbaren Skripten und reinen Datenblöcken wie application/json.

Rückgabewert

Typ

string

Beschreibung

Der Wert des type-Attributs, zum Beispiel "text/javascript". Fehlt das Attribut, ist der Wert eine leere Zeichenkette.

Beispiele

Typ eines Inline-SVG-Skripts auslesen

const svgNS = 'http://www.w3.org/2000/svg';
const svg = document.createElementNS(svgNS, 'svg');
const script = document.createElementNS(svgNS, 'script');
script.setAttribute('type', 'application/ecmascript');
svg.append(script);
document.body.append(svg);

console.log(script instanceof SVGScriptElement);
console.log(script.type);

true application/ecmascript

Fehlendes Attribut ergibt leere Zeichenkette

const script = document.createElementNS('http://www.w3.org/2000/svg', 'script');

console.log(JSON.stringify(script.type));
console.log(script.hasAttribute('type'));

"" false

SVG-Skripte in einem Dokument nach Typ prüfen

const jsTypes = new Set(['', 'text/javascript', 'application/javascript', 'application/ecmascript', 'text/ecmascript', 'module']);

const report = [...document.querySelectorAll('svg script')]
  .filter((el) => el instanceof SVGScriptElement)
  .map((el) => ({
    type: el.type || '(kein Typ)',
    ausfuehrbar: jsTypes.has(el.type.trim().toLowerCase())
  }));

console.table(report);

Tabelle mit Typ und Ausführbarkeit aller SVG-Skripte

// Wichtig · Fallstricke

Schreibschutz: MDN nennt die Eigenschaft schreibgeschützt. In der SVG-2-Spezifikation ist sie aber als attribute DOMString type ohne readonly definiert, und moderne Browser erlauben meist das Setzen. Das ändert dann das Attribut. Verlässlich und in allen Browsern gleich funktioniert setAttribute('type', …).
Keine Normalisierung: Großschreibung und Leerzeichen bleiben so, wie sie im Markup stehen. Vergleiche deshalb mit trim() und toLowerCase().
Ausführung: Wenn du type änderst, nachdem das Skript ausgeführt wurde, wird es nicht erneut oder rückwirkend ausgeführt.
Nur SVG-Namensraum: Ein <script>, das mit document.createElement('script') erzeugt wurde, ist ein HTMLScriptElement und kein SVGScriptElement. Für SVG brauchst du createElementNS.
Sicherheit: Skripte in SVG-Dateien sind ein bekannter Weg für XSS-Angriffe. Beim Bereinigen von hochgeladenen SVGs reicht es nicht, nur type zu prüfen, denn auch Event-Attribute wie onload und javascript:-URLs führen Code aus. Entferne <script>-Elemente am besten vollständig.
Kompatibilität: Wird von allen modernen Browsern unterstützt.

Siehe auch

SVGScriptElement SVGScriptElement.crossOrigin HTMLScriptElement.type Element.setAttribute() Document.createElementNS() CSSPseudoElement.type HTMLOutputElement.type