NamedNodeMap.length — Eigenschaft · JavaScript-Referenz

Signatur

get NamedNodeMap.prototype.length

Beschreibung

Die Eigenschaft NamedNodeMap.length liefert die Anzahl der Einträge in einer NamedNodeMap. In der Praxis begegnet man einer NamedNodeMap fast ausschließlich über Element.attributes. length entspricht dort also der Anzahl der Attribute, die an einem Element gesetzt sind.

Die Eigenschaft ist schreibgeschützt. Die Map ist aber live: Wenn Attribute per setAttribute() hinzukommen oder per removeAttribute() entfernt werden, ändert sich length sofort.

Typische Einsatzfälle sind klassische for-Schleifen mit item(i) oder dem Index-Zugriff attributes[i]. Außerdem lässt sich damit schnell prüfen, ob ein Element überhaupt Attribute hat. Alternativ gibt es dafür Element.hasAttributes().

Rückgabewert

Typ

number

Beschreibung

Eine nicht-negative Ganzzahl: die Anzahl der Knoten (bei Element.attributes also der Attribute) in der Map.

Beispiele

Anzahl der Attribute eines Elements ermitteln

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

console.log(input.attributes.length);

3

Alle Attribute mit einer for-Schleife auflisten

const link = document.createElement('a');
link.href = '/impressum';
link.className = 'footer-link';
link.target = '_blank';

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

href = "/impressum" class = "footer-link" target = "_blank"

Live-Verhalten: length ändert sich mit den Attributen

const div = document.createElement('div');
const attrs = div.attributes; // Referenz einmal holen

console.log(attrs.length); // 0
div.setAttribute('id', 'box');
div.dataset.state = 'open';
console.log(attrs.length); // 2
div.removeAttribute('id');
console.log(attrs.length); // 1

0 2 1

Alle Attribute sicher entfernen

const el = document.createElement('span');
el.setAttribute('id', 'x');
el.setAttribute('title', 'Hinweis');
el.setAttribute('lang', 'de');

// Rückwärts bzw. solange length > 0 – wegen Live-Map
while (el.attributes.length > 0) {
  el.removeAttribute(el.attributes[0].name);
}
console.log(el.attributes.length, el.outerHTML);

0 <span></span>

// Wichtig · Fallstricke

Live-Collection: Wer in einer vorwärts laufenden Schleife bis length Attribute entfernt, überspringt Einträge, weil sich Indizes und length während der Schleife verschieben. Deshalb rückwärts iterieren oder vorher mit Array.from(el.attributes) eine Kopie anlegen.
Schreibgeschützt: Eine Zuweisung wie attrs.length = 0 wird im Sloppy Mode stillschweigend ignoriert und löst im Strict Mode einen TypeError aus. Attribute werden dadurch nicht entfernt.
Kein Array: NamedNodeMap hat zwar length und einen Index-Zugriff, aber keine Array-Methoden wie map() oder forEach(). Sie ist jedoch iterierbar, for...of und der Spread-Operator funktionieren also.
Die Reihenfolge der Einträge ist nicht garantiert. Sie folgt in der Praxis meist der Reihenfolge, in der die Attribute gesetzt wurden.
Für eine reine Existenzprüfung ist el.hasAttributes() lesbarer als el.attributes.length > 0.
Kompatibilität: wird seit DOM Level 1 von allen Browsern unterstützt.

Siehe auch

Element.attributes Attr MediaList.length NodeList.length TimeRanges.length