NamedNodeMap.item() — Methode · JavaScript-Referenz

Signatur

NamedNodeMap.prototype.item(index)

Beschreibung

Die Methode item() liefert den Eintrag einer NamedNodeMap an einer bestimmten Position. In der Praxis begegnet man einer NamedNodeMap fast ausschließlich über Element.attributes. Jeder Eintrag ist dann ein Attr-Objekt mit den Eigenschaften name und value.

Nützlich ist item(), wenn du alle Attribute eines Elements durchlaufen willst, ohne ihre Namen zu kennen, etwa zum Kopieren, Serialisieren oder Debuggen. Zusammen mit der Eigenschaft length ergibt sich eine klassische Indexschleife.

Statt map.item(i) kannst du auch den Indexzugriff map[i] verwenden. Der Unterschied: item() gibt bei einem ungültigen Index null zurück, map[i] dagegen undefined. Die Reihenfolge der Attribute entspricht zwar in allen aktuellen Browsern der Einfügereihenfolge, die Spezifikation garantiert aber keine bestimmte Sortierung. Verlasse dich also nicht auf feste Positionen.

Parameter

Name	Typ	Default	Beschreibung
$index Pflicht	number		Nullbasierter Index des gewünschten Eintrags. Der Wert wird in eine vorzeichenlose 32-Bit-Ganzzahl umgewandelt (`unsigned long`).

Rückgabewert

Typ

Attr | null

Beschreibung

Das Attr-Objekt an der Position index oder null, wenn index größer oder gleich length ist.

Beispiele

Alle Attribute eines Elements auflisten

const link = document.createElement('a');
link.setAttribute('href', '/kontakt');
link.setAttribute('class', 'nav-link');
link.setAttribute('data-track', 'menu');

const attrs = link.attributes;
for (let i = 0; i < attrs.length; i++) {
  const attr = attrs.item(i);
  console.log(`${attr.name} = ${attr.value}`);
}

href = /kontakt class = nav-link data-track = menu

Ungültiger Index: item() vs. Indexzugriff

const div = document.createElement('div');
div.id = 'box';

console.log(div.attributes.item(0).name);
console.log(div.attributes.item(5));
console.log(div.attributes[5]);

id null undefined

Attribute von einem Element auf ein anderes kopieren

const copyAttributes = (source, target) => {
  const { attributes } = source;
  for (let i = 0; i < attributes.length; i++) {
    const { name, value } = attributes.item(i);
    target.setAttribute(name, value);
  }
};

const original = document.createElement('input');
original.setAttribute('type', 'email');
original.setAttribute('required', '');

const clone = document.createElement('input');
copyAttributes(original, clone);
console.log(clone.outerHTML);

// Wichtig · Fallstricke

Live-Sammlung: Eine NamedNodeMap ist live. Entfernst du in einer Vorwärtsschleife Attribute mit removeAttribute(), verschieben sich die Indizes und Einträge werden übersprungen. Durchlaufe die Sammlung in diesem Fall rückwärts oder kopiere sie vorher mit Array.from(el.attributes).
Reihenfolge: Die Spezifikation garantiert keine bestimmte Reihenfolge. Um ein bestimmtes Attribut zu lesen, verwende getNamedItem() oder getAttribute() statt eines festen Index.
Negative Indizes werden zu großen vorzeichenlosen Zahlen umgewandelt und liefern deshalb null. Ein item(-1) für das letzte Element funktioniert nicht.
Ohne Argument wirft der Aufruf einen TypeError.
Moderne Alternative: NamedNodeMap ist iterierbar, also funktionieren for...of und Array.from(). Beides wird in allen aktuellen Browsern unterstützt. item() selbst läuft überall, auch in sehr alten Browsern.

Siehe auch

Element.attributes Attr MediaList.item() NamedNodeMap.getNamedItem() NamedNodeMap.setNamedItem()