Using get/setAttributeNode to set an element's value

[RobG]

I was messing with get/setAttributeNode to set an element's value and
it seems that all of the following are W3C DOM 2 Core compliant:

el.getAttributeNode('value').value = newValue;

and

var attNode = document.createAttribute('value');
attNode.value = newValue;
el.setAttributeNode(attNode);

and

var attNode = el.getAttributeNode('value');
attNode.value = newValue;
el.setAttributeNode(attNode);

For the last one, IE 6 shows an error but successfully changes the
attribute value.

Is there any reason to prefer the second or third over the first?

Using getAttributeNode to set values seems a bit strange and makes me
wonder what the purpose of setAttributeNode is (other than
completeness). But if it's OK to use then I'll do that because it's
much more concise.

 

[Erwin Moller]

I was messing with get/setAttributeNode to set an element's value and
it seems that all of the following are W3C DOM 2 Core compliant:

el.getAttributeNode('value').value = newValue;

and

var attNode = document.createAttribute('value');
attNode.value = newValue;
el.setAttributeNode(attNode);

and

var attNode = el.getAttributeNode('value');
attNode.value = newValue;
el.setAttributeNode(attNode);

For the last one, IE 6 shows an error but successfully changes the
attribute value.

Is there any reason to prefer the second or third over the first?

Using getAttributeNode to set values seems a bit strange and makes me
wonder what the purpose of setAttributeNode is (other than
completeness). But if it's OK to use then I'll do that because it's
much more concise.

Hi Rob,

Why don't you use the DOM properties instead?
I try to stay away from getting/setting attributes because they confused
the hell out of me in different browsers.

David Mark wrote a (too) short piece on the issue that helped me
understand it a little better.
http://www.cinsoft.net/attributes.html

If you *must* use attributes, wait for the guru's to answer. ;-)

Regards,
Erwin Moller

 

[RobG]

On Mar 1, 5:55 pm, Erwin Moller
[...]

Why don't you use the DOM properties instead?

Because there are cases where both the DOM property and getAttribute
return the wrong value (e.g. in IE < 8 for button@value).

 

[Thomas 'PointedEars' Lahn]

I was messing with get/setAttributeNode to set an element's value and
it seems that all of the following are W3C DOM 2 Core compliant:

el.getAttributeNode('value').value = newValue;

Do not grow reference worms.

and

var attNode = document.createAttribute('value');
attNode.value = newValue;
el.setAttributeNode(attNode);

and

var attNode = el.getAttributeNode('value');
attNode.value = newValue;
el.setAttributeNode(attNode);

The last line is superfluous.

For the last one, IE 6 shows an error but successfully changes the
attribute value.

Which error?

Is there any reason to prefer the second or third over the first?

There is reason not to use any of them. For your first approach, see above.

Your second approach creates a new attribute node object just to replace an
existing node. This is inefficient.

For your third approach, see above.

Using getAttributeNode to set values seems a bit strange and makes me
wonder what the purpose of setAttributeNode is (other than
completeness).

AISB numerous times, the DOM is a language-independent API. Not all
programming languages support all approaches.

But if it's OK to use then I'll do that because it's much more concise.

Element::setAttributeDOMString, OMString) and
Element::setAttributeNodeAttr) are primarily designed to add new attribute
(nodes); changing the value of existing ones is a secondary effect.

Note that their signatures differ. It is actually a mark of a good API that
if the signatures differ, the method names differ as well. The concept
competes with that of method overloading, which is based on polymorphism and
strictly typed method parameters. Where the latter are unavailable, method
overloading should be avoided. So a language-independent API would
definitely avoid method overloading.

Also note that there is Element::setAttributeNSDOMString, OMString,
OMString).


PointedEars