What is the difference between calling setAttribute and setAttributeNS with null as the namespace parameter?

Also is there an issue with using getAttribute() and then setAttributeNS ?

What is the difference between calling setAttribute and setAttributeNS with null as the namespace parameter?

Also is there an issue with using getAttribute() and then setAttributeNS ?

• javascript
• attributes

4 Answers 4

setAttribute() is a DOM 1 function. setAttributeNS() is a DOM 2 function that resolves the problem of conflicting tag or attribute names by specifying the xmlns namespace that should apply to the tag/attribute in the first argument.

If an attribute does not have a defined namespace prefix, the first argument must be null. You could use setAttribute() but for consistency it is advisable to stick to setAttributeNS(). See:

https://developer.mozilla.org/en/docs/Web/SVG/Namespaces_Crash_Course#Scripting_in_namespaced_XML

"However, note carefully: the Namespaces in XML 1.1 recommendation states that the namespace name for attributes without a prefix does not have a value. In other words, although the attributes belong to the namespace of the tag, you do not use the tag's namespace name. Instead, you must use null as the namespace name for unqualified (prefixless) attributes."

The setAttributeNS method is an XML method, and will not work with HTML elements.

Here's an explanation in English, from the MDN docs:

// Given:
//   <div id="div1" xmlns:special="http://www.mozilla.org/ns/specialspace"
//     special:specialAlign="utterleft" width="200px" /> 

d = document.getElementById("div1"); 
d.removeAttributeNS("http://www.mozilla.org/ns/specialspace", "specialAlign"); 

// Now:
//   <div id="div1" width="200px" />

So from this, it appears that xmlns:special="http://www.mozilla.org/ns/specialspace" is a declaration of the namespace special, which is then used to contextualize special:specialAlign.

setAttributeNS is used for specifying the namespace and adds a new attribute with a namespace. NS represent that. Also it requires three parameters

element.setAttributeNS(ns,name,value)

ns  :namespace URI of the attribute to set
name:Name of the attribute to set
value:Value of the attribute to set

setAttribute(name,value) which is use to add a new attribute or change the value of existing attribute.