React Native

Iterate over Direct Child Nodes by Index

See more XML Examples

Demonstrates some ways to iterate over direct child nodes by index.

The input XML, available at http://www.chilkatsoft.com/data/get_child.xml, is this:

<root>
    <fruit color="red">apple</fruit>
    <fruit color="green">pear</fruit>
    <veg color="orange">carrot</veg>
    <meat animal="cow">beef</meat>
    <xyz>
        <fruit color="blue">blueberry</fruit>
        <veg color="green">broccoli</veg>
    </xyz>
    <fruit color="purple">grape</fruit>
    <cheese color="yellow">cheddar</cheese>
</root>

React Native

import { Xml } from '@chilkat/react-native'

function chilkatExample() {
  const xml = new Xml();

  // The sample input XML is available at http://www.chilkatsoft.com/data/get_child.xml
  try {
    xml.loadXmlFile('get_child.xml');
  } catch {
    console.log(xml.lastErrorText);
    return;
  }

  // The NumChildren property contains the number of direct
  // child nodes.  Note: The child nodes under "xyz" are NOT
  // direct children of "root".  Therefore, the "root" node has
  // 7 direct children
  console.log(`NumChildren = ${xml.numChildren}`);

  // Iterate over the direct children by index. The first child
  // is at index 0.
  for (let i = 0; i < xml.numChildren; i++) {
    //  access the tag and content directly by index:
    console.log(`${i}: ${xml.getChildTagByIndex(i)} : ${xml.getChildContentByIndex(i)}`);
  }

  console.log('-----');

  // Do the same as the above loop, but get the child node
  // and access the Tag and Content properties:
  for (let i = 0; i < xml.numChildren; i++) {
    const child = xml.getChild(i);
    console.log(`${i}: ${child.tag} : ${child.content}`);
  }

  console.log('-----');

  // Do the same as the above loop, but instead of creating
  // a new object instance for each child, call GetChild2 to
  // update the object's reference instead.
  for (let i = 0; i < xml.numChildren; i++) {
    // Navigate to the Nth child.  
    xml.getChild2(i);
    console.log(`${i}: ${xml.tag} : ${xml.content}`);
    // Navigate back up to the parent:
    xml.getParent2();
  }

  console.log('-----');

  // Notice that the Content of the "xyz" node is empty.  This is correct.
  // The "xyz" node has no Content, but 2 direct children.
}