frequently ask ? : Computers : Programming : Languages : JavaScript : XML : E4X (ECMAScript for XML)

+ Search
Add Entry AlertManage Folder Edit Entry Add page to http://del.icio.us/
Did You Find This Entry Useful?

5 of 6 people (83%) answered Yes
Recently 5 of 6 people (83%) answered Yes

Entry

How can I access the descendant elements of an XML object representing an element?
How can I access the descendant elements of an XML object representing an element?
How can I access the descendant nodes of an XML object representing an element?

Apr 3rd, 2005 04:06
Martin Honnen,


There are two ways to access descendants, the descendant accessor
denoted by two dots (e.g.
  xmlObject..propertyName
), and the method named descendants (e.g.
  xmlObject.descendants('propertyName')
).
Both ways yield an XMLList object with elements or nodes matching the
propertyName thus with the following XML object:
  var html = <html id="root">
    <head>
      <title>Example HTML with paragraphs</title>
    </head>
    <body>
      <p id="p1">Kibology for all.</p>
      <div id="d1">
        <p>All for Kibology.</p>
      </div>
    </body>
  </html>;
you can either use
  var paragraphs = html..p;
  alert(paragraphs.length()); // shows 2
to access all descendant <p> elements or use
  var paragraphs = html.descendants('p');
  alert(paragraphs.length()); // shows 2
to get the same result.
As with child node access the property name can be the wild card '*' to
access all descendant nodes of all kinds e.g. continueing with the above
example all descendant nodes are accessed with
  var descendants = html..*;
  alert(descendants.length()); // shows 9
  var result = '';
  for each (var xmlNode in descendants) {
    result += xmlNode.nodeKind() + ': ' + xmlNode.name() + '\r\n';
  }
  alert(result);
  /* shows
  'element: head
   element: title
   text: null
   element: body
   element: p
   text: null
   element: div
   element: p
   text: null'
  */
Contrary to the child nodes access where there are two short notations,
the dot notation and the bracket notation, where the latter allows you
to deal with element names which are not JavaScript identifiers (e.g.
xmlObject['child-element-name']) for descendants access there is no
short notation if the name is not an identifier so here you will need to
make use of the descendants method often:
  var xml = <god-list>
    <internet-god>Kibo</internet-god>
    <internet-god>Xibo</internet-god>
  </god-list>;
  var childGods = xml['internet-god'];
  alert(childGods.length()); // shows 2
  var descendantGods = xml.descendants('internet-god');
  alert(descendantGods.length()); // shows 2
Surprisingly the (so called) descendants accessor and the descendants
method take also an attribute identifier as the property name so that
you can access all the attributes of the XML object and its descendants
with one expression:
  var html = <html id="root">
    <head>
      <title>Example HTML with paragraphs</title>
    </head>
    <body>
      <p id="p1" class="class1">Kibology for all.</p>
      <div id="d1">
        <p>All for Kibology.</p>
      </div>
    </body>
  </html>;
  var idAttributeList = html..@id;
  alert(idAttributeList.length()); // shows 3
Take notice that the id attribute of the XML object the descendants
accessor respectively the descendants method is used on (e.g. the <html>
element) is included.
If you only wanted a list with all id attributes of descendants nodes
you would need to use
  var attributeList = html..*.@id;
  alert(attributeList.length()); // shows 2
Wild card access with '@*' to access all attributes on all levels is
possible too so continueing with the above example you get:
  var attributeList = html..@*;
  alert(attributeList.length()); // shows 4
for the three id attributes and the one class attribute.