Rough Guide To The DOM (part 1) - Alternatives (
Page 7 of 8 )
An alternative way of obtaining (and setting) attribute values is via the
attributes[] collection, which is essentially an array containing a list of
all the attribute-value pairs for a specific tag. I've modified the
previous example to illustrate how this works - uncomment the various
alert()s to see the values of the different properties.
<html><head></head><body id="body" bgcolor="white"><font face="Arial"
size="2">This stuff is giving me a headache already!</font>
<script language="JavaScript">
// get to the <font> tag
var fontObj = document.getElementById("body").childNodes[0];
// return the number of attributes of the <font> tag
// or the length of the attributes[] collection
// returns 2
// alert(fontObj.attributes.length);
// returns the name of the first attribute - "face"
// alert(fontObj.attributes[0].name);
// returns the value of the first attribute - "Arial"
// alert(fontObj.attributes[0].value);
// changes the value of the first attribute to "Verdana"
fontObj.attributes[0].value = "Verdana";
// returns the new value of the first attribute - "Verdana"
// alert(fontObj.attributes[0].value);
</script>
</body>
</html>
/ 10 
