Start · Sprachen · JavaScript · Referenz · Element.getAttributeNodeNS()

Element.getAttributeNodeNS()

Methode

Gibt das Attribut mit dem angegebenen Namensraum und lokalen Namen als <code>Attr</code>-Knoten zurück oder <code>null</code>, wenn es nicht existiert.

seit JavaScript Baseline: alle Browser (DOM Level 2) Kategorie: webapi

Signatur

Element.prototype.getAttributeNodeNS(namespace, localName)

Beschreibung

getAttributeNodeNS() sucht ein Attribut anhand seines Namensraum-URI und seines lokalen Namens (ohne Präfix). Die Methode gibt dabei nicht nur den Wert zurück, sondern den ganzen Attr-Knoten. Über diesen kommt man an name, localName, prefix, namespaceURI, value und ownerElement.

Gebraucht wird die Methode vor allem bei XML-Dokumenten, die mehrere Namensräume mischen, also bei SVG mit xlink:href, MathML, XHTML oder eigenen XML-Formaten, die mit DOMParser eingelesen werden. Das Präfix im Dokument ist frei wählbar. Deshalb ist die Suche über den Namensraum-URI verlässlicher als die Suche über den qualifizierten Namen mit getAttributeNode().

Wenn Sie nur den Wert brauchen, ist getAttributeNS() meist einfacher. getAttributeNodeNS() lohnt sich, wenn Sie Metadaten wie das tatsächlich verwendete Präfix auslesen oder den Knoten weiterverarbeiten wollen, etwa mit removeAttributeNode().

Parameter

Name Typ Default Beschreibung
$namespace Pflicht string | null Namensraum-URI des gesuchten Attributs, z. B. "http://www.w3.org/1999/xlink". Für Attribute ohne Namensraum null oder "" übergeben.
$localName Pflicht string Lokaler Name des Attributs ohne Präfix, z. B. "href" statt "xlink:href".

Rückgabewert

Typ
Attr | null
Beschreibung
Der passende Attr-Knoten oder null, wenn das Element kein solches Attribut hat.

Beispiele

xlink:href eines SVG-Elements auslesen

const XLINK = 'http://www.w3.org/1999/xlink';
const SVG = 'http://www.w3.org/2000/svg';

const use = document.createElementNS(SVG, 'use');
use.setAttributeNS(XLINK, 'xlink:href', '#icon-star');

const attr = use.getAttributeNodeNS(XLINK, 'href');
console.log(attr.name, attr.prefix, attr.localName, attr.value);
xlink:href xlink href #icon-star

Namensraum-Attribute in geparstem XML finden

const xml = `<buch xmlns:m="urn:meta" m:isbn="978-3-16-148410-0" titel="DOM"/>`;
const doc = new DOMParser().parseFromString(xml, 'application/xml');
const buch = doc.documentElement;

const isbn = buch.getAttributeNodeNS('urn:meta', 'isbn');
console.log(isbn?.value);        // Treffer
console.log(isbn?.ownerElement === buch);

// Attribut ohne Namensraum: null übergeben
console.log(buch.getAttributeNodeNS(null, 'titel').value);

// Falscher Namensraum ergibt null
console.log(buch.getAttributeNodeNS('urn:anders', 'isbn'));
978-3-16-148410-0 true DOM null

Gefundenen Attributknoten entfernen

const XLINK = 'http://www.w3.org/1999/xlink';
const link = document.createElementNS('http://www.w3.org/2000/svg', 'a');
link.setAttributeNS(XLINK, 'xlink:title', 'Veraltet');

const node = link.getAttributeNodeNS(XLINK, 'title');
if (node) {
  link.removeAttributeNode(node);
}
console.log(link.hasAttributeNS(XLINK, 'title'));
false

// Wichtig · Fallstricke

  • Nur den lokalen Namen übergeben: getAttributeNodeNS(XLINK, 'xlink:href') findet nichts und gibt null zurück. Richtig ist 'href'.
  • Bei gewöhnlichen HTML-Attributen wie class oder id ist der Namensraum null und nicht der XHTML-Namensraum. Wer hier den XHTML-URI übergibt, bekommt null.
  • Der Rückgabewert kann null sein. Prüfen Sie ihn deshalb vor dem Zugriff auf .value oder verwenden Sie optionale Verkettung (?.).
  • Der zurückgegebene Attr ist live: Wird sein value geändert, ändert sich auch das Attribut am Element.
  • SVG 2 erlaubt href ohne Namensraum. Neuere SVG-Dateien haben deshalb oft gar kein xlink:href mehr. Prüfen Sie im Zweifel beide Varianten.
  • Die Methode wird von allen modernen Browsern unterstützt. In der Praxis reicht meist getAttributeNS(), weil nur der Wert gebraucht wird.