Programmer to Programmer

JavaScript
Programmer's
Reference

PrevHomeUpNext

Attributes object (Object/DOM)

A sub-class of the Array object that contains a set of Element object attributes. This is a collection of all attribute objects that apply to an element.

Availability:

DOM level - 1
JavaScript - 1.5
JScript - 5.0
Internet Explorer - 5.0
Netscape - 6.0
JavaScript syntax:-myAttributes = myElement.attributes
Object properties:length

The Attributes array object is associated with an Element object as a container for a set of Attribute objects each of which relates to a property of the Element object. This is the correct implementation of the DOM specified Attr object class.

Not all Element object properties have an Attribute object, but those that do have related to HTML tag attributes. Thus the Attributes array corresponds to the HTML tag attributes for a tag.

The Attributes array has a length property and a named property for each Element object tag attribute.

Properties are reserved to support event handlers and other tag attributes and so from the Attributes array for a particular Element object, you can establish what the supported features are for the HTML tag it represents. This means that the length property will vary from object to object.

The Attributes array seems to contain some properties that correspond to the imaginary HTML generic Element class. Although this is not really a genuine object class, it is a convenient way of documenting HTML object behaviors where they are common across a range of objects. The Attributes array does not support a complete set of properties that correspond to the Element class and therefore it is not true to say it is inherited from that class.

The example script shows how you can inspect the attributes of an object. In this example, the attributes of a <BODY> tag are exposed. Because they are enumerable, you can determine what properties and what events the object instantiated by the <BODY> tag can respond to. Note that the example does not work on Netscape 6.0 due to the use of the all property.

Example code:

   <HTML>

   <HEAD></HEAD>

   <BODY alink=red vlink="blue" leftmargin="100">

   <TABLE BORDER=1 CELLPADDING=2>

   <SCRIPT>

   myAttributesObject = document.all[3].attributes;

   displayTableLine("Object class:", myAttributesObject, "");

   displayTableLine("Number of attributes:", myAttributesObject.length, "");

   for(myEnumerator=0; myEnumerator<myAttributesObject.length; myEnumerator++)

   {

      myAttrib = myAttributesObject[myEnumerator];

      displayTableLine("Attribute ("+myAttrib.nodeName+"):", myAttrib.specified, myAttrib.nodeValue);

   }

   

   // Output one line of a table

   function displayTableLine(aHeading, aFlag, aValue)

   {

      document.write("<TR>");

      document.write("<TH ALIGN=LEFT>");

      document.write(aHeading);

      document.write("</TH>");

      document.write("<TD>");

      document.write(aFlag);

      document.write("</TD>");

      document.write("<TD>");

      document.write(aValue);

      document.write("</TD>");

      document.write("</TR>");

   }

   </SCRIPT>

   </TABLE>

   </BODY>

   </HTML>

See also:Attribute object, Attributes.length, Collection object, Element object, Element.attributes[], Element.removeAttribute(), HasProperty(), HTML object, HTML tag attribute

PropertyJavaScriptJScriptNIEOperaNESECMADOMCSSHTMLNotes
length1.5 1.55.0 5.06.0 6.05.0 5.0 n/a n/a n/a1 1 n/a n/aReadOnly

PrevHomeNext
Attribute.valueUpAttributes.length

JavaScript Programmer's Reference, Cliff Wootton
Wrox Press (www.wrox.com)

Join the Wrox JavaScript forum at p2p.wrox.com
Please report problems to support@wrox.com

© 2001 Wrox Press. All Rights Reserved. Terms and conditions.