SVGStringList.removeItem() — Methode · JavaScript-Referenz

Signatur

SVGStringList.prototype.removeItem(index)

Beschreibung

Die Methode removeItem() der Schnittstelle SVGStringList entfernt den Eintrag an Position index aus der Liste. Die folgenden Einträge rücken um eine Stelle nach vorn, numberOfItems bzw. length wird um eins kleiner. Als Rückgabewert erhalten Sie die entfernte Zeichenkette.

Eine SVGStringList finden Sie vor allem bei den bedingten Verarbeitungsattributen von SVG-Elementen, also bei element.requiredExtensions und element.systemLanguage. Die Liste ist live: Wenn Sie einen Eintrag mit removeItem() entfernen, ändert sich sofort auch das zugehörige Attribut im DOM. Dadurch kann sich wiederum ändern, ob das Element dargestellt wird, zum Beispiel innerhalb eines <switch>-Elements.

Sie verwenden die Methode, wenn Sie Sprach- oder Erweiterungsbedingungen per Skript lockern oder anpassen möchten, ohne das Attribut von Hand als Zeichenkette neu zusammenzusetzen.

Parameter

Name	Typ	Default	Beschreibung
$index Pflicht	number		Nullbasierte Position des zu entfernenden Eintrags. Der Wert muss kleiner als `numberOfItems` sein. Er wird in eine vorzeichenlose 32-Bit-Ganzzahl umgewandelt.

Rückgabewert

Typ

string

Beschreibung

Die Zeichenkette, die aus der Liste entfernt wurde.

Beispiele

Eine Sprache aus systemLanguage entfernen

const SVG_NS = 'http://www.w3.org/2000/svg';
const text = document.createElementNS(SVG_NS, 'text');
text.setAttribute('systemLanguage', 'de, en, fr');

const langs = text.systemLanguage;
console.log(langs.numberOfItems); // 3

const removed = langs.removeItem(1);
console.log(removed);             // "en"
console.log(langs.numberOfItems); // 2
console.log(langs.getItem(1));    // "fr"

3 en 2 fr

Alle Vorkommen eines Wertes entfernen (rückwärts iterieren)

const removeValue = (list, value) => {
  // Rückwärts laufen, damit das Nachrücken die Indizes nicht verschiebt
  for (let i = list.numberOfItems - 1; i >= 0; i--) {
    if (list.getItem(i) === value) list.removeItem(i);
  }
};

const SVG_NS = 'http://www.w3.org/2000/svg';
const g = document.createElementNS(SVG_NS, 'g');
g.setAttribute('systemLanguage', 'en, de, en-US, en');

removeValue(g.systemLanguage, 'en');
console.log(g.systemLanguage.numberOfItems); // 2
console.log(g.systemLanguage.getItem(0));    // "de"

2 de

Ungültigen Index abfangen

const SVG_NS = 'http://www.w3.org/2000/svg';
const rect = document.createElementNS(SVG_NS, 'rect');
rect.setAttribute('systemLanguage', 'de');

try {
  rect.systemLanguage.removeItem(5);
} catch (err) {
  console.log(err.name); // "IndexSizeError"
}

IndexSizeError

// Wichtig · Fallstricke

Ist index größer als oder gleich numberOfItems, wird eine DOMException vom Typ IndexSizeError ausgelöst. Bei einer schreibgeschützten Liste kommt es zu einem NoModificationAllowedError.
Nach dem Entfernen rücken die folgenden Einträge nach vorn. Wenn Sie in einer Schleife mehrere Einträge entfernen, laufen Sie deshalb rückwärts durch die Liste, sonst überspringen Sie Einträge.
Die Liste ist live und mit dem Attribut verbunden. Eine Änderung wirkt sich sofort auf die bedingte Darstellung aus, etwa innerhalb von <switch>.
In welcher Form das Attribut nach der Änderung wieder als Text ausgegeben wird (Trennzeichen, Leerzeichen), kann sich je nach Browser leicht unterscheiden. Lesen Sie die Werte daher besser über getItem() aus, statt den Attributtext zu vergleichen.
Die Methode wird von allen modernen Browsern unterstützt. requiredFeatures wurde in SVG 2 entfernt. Verwenden Sie stattdessen systemLanguage oder requiredExtensions.

Siehe auch

SVGStringList SVGStringList.appendItem() SVGStringList.insertItemBefore() SVGStringList.replaceItem() SVGStringList.getItem() SVGStringList.clear() SVGStringList.numberOfItems