Attr.namespaceURI — Eigenschaft · JavaScript-Referenz

Signatur

get Attr.prototype.namespaceURI

Beschreibung

Die schreibgeschützte Eigenschaft namespaceURI eines Attr-Knotens liefert den Namespace-URI, zu dem das Attribut gehört, etwa "http://www.w3.org/1999/xlink" für xlink:href. Gehört das Attribut zu keinem Namespace, ist der Wert null.

Wichtig: Der Namespace eines Attributs hängt nicht vom Namespace seines Elements ab. Normale Attribute ohne Präfix wie width oder class haben auch bei SVG- oder MathML-Elementen den Wert null. Einen Namespace haben nur Attribute, die mit setAttributeNS() gesetzt wurden, die ein XML-Parser mit gebundenem Präfix erzeugt hat oder die der HTML-Parser bei eingebettetem SVG/MathML angepasst hat (xlink:*, xml:*, xmlns, xmlns:*).

Brauchen kannst du die Eigenschaft vor allem bei XML-Dokumenten (RSS, Atom, SVG, XHTML, Office-Formate), bei der Serialisierung oder beim Kopieren von Attributen zwischen Elementen. Zusammen mit localName legt namespaceURI ein Attribut eindeutig fest. Genau diese beiden Werte erwarten Methoden wie getAttributeNS() und setAttributeNS().

Rückgabewert

Typ

string | null

Beschreibung

Der Namespace-URI des Attributs oder null, wenn es in keinem Namespace liegt.

Beispiele

Attribute eines eingebetteten SVG-Elements untersuchen

const container = document.createElement('div');
container.innerHTML = `
  <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
    <use xlink:href="#icon" width="24"/>
  </svg>`;

const use = container.querySelector('use');
for (const attr of use.attributes) {
  console.log(attr.name, '→', attr.namespaceURI);
}

xlink:href → http://www.w3.org/1999/xlink width → null

setAttribute() und setAttributeNS() im Vergleich

const SVG_NS = 'http://www.w3.org/2000/svg';
const XLINK_NS = 'http://www.w3.org/1999/xlink';

const img = document.createElementNS(SVG_NS, 'image');
img.setAttributeNS(XLINK_NS, 'xlink:href', 'bild.png');
img.setAttribute('xlink:title', 'Vorschau'); // Achtung: kein Namespace!

console.log(img.getAttributeNode('xlink:href').namespaceURI);
console.log(img.getAttributeNode('xlink:title').namespaceURI);

http://www.w3.org/1999/xlink null

Namespace-Attribute in einem XML-Dokument auswerten

const xml = `<buch xmlns:dc="http://purl.org/dc/elements/1.1/" dc:title="JavaScript" id="b1"/>`;
const doc = new DOMParser().parseFromString(xml, 'application/xml');

for (const attr of doc.documentElement.attributes) {
  console.log(`${attr.localName}: ${attr.namespaceURI}`);
}

// Nur Dublin-Core-Attribute herausfiltern
const dc = [...doc.documentElement.attributes]
  .filter((a) => a.namespaceURI === 'http://purl.org/dc/elements/1.1/')
  .map((a) => a.localName);
console.log(dc);

dc: http://www.w3.org/2000/xmlns/ title: http://purl.org/dc/elements/1.1/ id: null ["title"]

// Wichtig · Fallstricke

Schreibgeschützt: Die Eigenschaft ist ein Getter ohne Setter. Eine Zuweisung wird außerhalb des Strict Mode stillschweigend ignoriert. Im Strict Mode, also auch in ES-Modulen, löst sie einen TypeError aus. Um den Namespace zu ändern, entfernst du das Attribut und setzt es mit setAttributeNS() neu.
Präfix ist nicht gleich Namespace: setAttribute('xlink:href', …) legt ein Attribut mit dem wörtlichen Namen xlink:href an, aber mit namespaceURI === null. Deshalb findet getAttributeNS(XLINK_NS, 'href') dieses Attribut nicht.
Normale Attribute ohne Präfix liegen auch bei SVG-Elementen in keinem Namespace (null). Der Namespace des Elements, Element.namespaceURI, wird nicht übernommen.
Namespace-Deklarationen wie xmlns und xmlns:* sind selbst Attribute mit dem Namespace http://www.w3.org/2000/xmlns/.
Vergleiche immer mit dem vollständigen URI, nicht mit dem Präfix. Präfixe kann jedes Dokument frei wählen.
Kompatibilität: Die Eigenschaft wird in allen modernen Browsern unterstützt. Früher lag namespaceURI auf Node. Laut aktuellem DOM-Standard gibt es sie nur noch auf Attr und Element.

Siehe auch

Attr.localName Attr.prefix Attr.name Element.namespaceURI Element.setAttributeNS() Element.getAttributeNS() Attr