The attributes Property The attributes property is a very useful one; it returns a collectionthat is, an arrayof the attributes of an element. You can see the support for the attributes property in Table 5.6. Table 5.6. The attributes Property Property | NS2 | NS3 | NS4 | NS6 | IE3a | IE3b | IE4 | IE5 | IE5.5 | IE6 | attributes | | | | x | | | | x | x | x | | Read-only | | Type: Object array | This property returns an array of attribute objects; you can see the properties of attribute objects in Table 5.7. Table 5.7. The attribute Object Properties Property | IE6 | NS6 | Means | attributes | | x | Contained (nested) attributes | childNodes | | x | Array of child nodes | expando | x | | Indicates whether variables can be created within the object | firstChild | x | x | First child node | lastChild | x | x | Last child node | localName | | x | Local name (not qualified with the namespace, if there is one) | name | x | x | Name of the attribute | nameSpaceURI | | x | XML namespace Uniform Resource Identifier (URI) | nextSibling | x | x | Next sibling node | NodeName | x | x | Name of the attribute | NodeType | x | x | Node type, set to 2 | NodeValue | x | x | Value of the attribute | ownerDocument | x | x | Object reference to the current document | ownerElement | | x | Object reference to the containing element | parentNode | x | x | Object reference to the attribute's parent | prefix | | x | Prefix of the namespace, if there is one | previousSibling | x | x | Previous sibling node | specified | x | x | True if the attribute is explicitly listed, false if it's implicit | value | x | x | Value of the attribute | Here's an example; in this case, I'll take a look at the value of the onclick attribute's value in a button element: (Listing 05-03.html on the web site) <HTML> <HEAD> <TITLE>Using the attributes Property</TITLE> </HEAD> <BODY> <H1>Using the attributes Property</H1> <FORM NAME="form1"> <INPUT TYPE="BUTTON" ID="button1" ONCLICK="alert('Hello!')" VALUE="Click Me!"> <INPUT TYPE="TEXT" ID="text1" VALUE="Click Me!"> </FORM> <SCRIPT LANGUAGE="JavaScript"> <!-- document.write(document.form1.button1.attributes["onclick"].name + " = " + document.form1.button1.attributes["onclick"].value) // --> </SCRIPT> </BODY> </HTML> You can see the results in Figure 5.2. Figure 5.2. Looking at an attribute in the Netscape Navigator. |