The createAttributeNS() method of the Document interface creates a new attribute node with the specified namespace URI and qualified name.
The object created is a node implementing the Attr interface. The DOM does not enforce what sort of attributes can be added to a particular element in this manner.
createAttributeNS(namespaceURI, qualifiedName)namespaceURIA string that specifies the namespaceURI to associate with the attribute, or the empty string. In HTML documents, most attributes are in the null namespace — use the empty string for these. Use a specific namespace URI only when creating a namespaced attribute, such as xml:lang or xml:space. Some namespace URIs are:
http://www.w3.org/XML/1998/namespace (for xml:lang, xml:space)http://www.w3.org/2000/xmlns/ (for xmlns, xmlns:*)http://www.w3.org/1999/xlink (for xlink:href, xlink:title, etc.)qualifiedNameA string containing the qualified name of the new attribute. The name property of the created attribute is initialized with this value.
The format of the qualified name is prefix:localName or localName, where the parts are defined as:
prefix OptionalA "short alias" for the namespace. The prefix is optional, but if it is specified the namespaceURI parameter must also be specified. If the prefix is set to xml or xmlns, the namespaceURI must be set to http://www.w3.org/XML/1998/namespace or http://www.w3.org/2000/xmlns/, respectively.
The value is used to initialize the new attribute's prefix property. Defaults to null.
localNameThe local name of the attribute. The value is used to initialize the new attribute's localName property.
The new Attr node.
NamespaceError DOMExceptionThrown if the namespaceURI value is:
prefix has a value.http://www.w3.org/XML/1998/namespace or http://www.w3.org/2000/xmlns/ when prefix is set to xml or xmlns, respectively.InvalidCharacterError DOMExceptionThrown if either the prefix or localName is not valid:
prefix must have at least one character, and cannot contain ASCII whitespace, NULL, /, or > (U+0000, U+002F, or U+003E, respectively).localName must have at least one character, and may not contain ASCII whitespace, NULL, /, = or > (U+0000, U+002F, U+003D, or U+003E, respectively).Note: Earlier versions of the specification were more restrictive, requiring that the localName be a valid XML name.
This example creates an xml:lang attribute with the XML namespace and attaches it to a paragraph element. This attribute specifies the language of the element's content for XML processing.
<p id="greeting">Bonjour!</p>const el = document.getElementById("greeting");
const attr = document.createAttributeNS(
"http://www.w3.org/XML/1998/namespace",
"xml:lang",
);
attr.value = "fr";
el.setAttributeNode(attr);In HTML documents, unprefixed attributes (such as SVG presentation attributes like viewBox) are in the null namespace. Use the empty string for the namespaceURI parameter to match this.
<svg id="svg"></svg>const svg = document.getElementById("svg");
const attr = document.createAttributeNS("", "viewBox");
attr.value = "0 0 100 100";
svg.setAttributeNode(attr);
console.log(svg.getAttribute("viewBox")); // "0 0 100 100"Note that, in most cases, you can use Element.setAttribute() instead of createAttributeNS() for unprefixed attributes:
svg.setAttribute("viewBox", "0 0 100 100");