XML Tree

ML documents form a tree structure that starts at "the root" and branches to "the leaves".

An Example XML Document

XML documents use a self-describing and simple syntax:



Tove
Jani
Reminder
Don't forget me this weekend!

The first line is the XML declaration. It defines the XML version (1.0) and the encoding used (ISO-8859-1 = Latin-1/West European character set).

The next line describes the root element of the document (like saying: "this document is a note"):

The next 4 lines describe 4 child elements of the root (to, from, heading, and body):

Tove
Jani
Reminder
Don't forget me this weekend!

And finally the last line defines the end of the root element:

 

You can assume, from this example, that the XML document contains a note to Tove from Jani.

Don't you agree that XML is pretty self-descriptive?


XML Documents Form a Tree Structure

XML documents must contain a root element. This element is "the parent" of all other elements.

The elements in an XML document form a document tree. The tree starts at the root and branches to the lowest level of the tree.

All elements can have sub elements (child elements):



.....

The terms parent, child, and sibling are used to describe the relationships between elements. Parent elements have children. Children on the same level are called siblings (brothers or sisters).

All elements can have text content and attributes (just like in HTML).


Example:

DOM node tree

The image above represents one book in the XML below:



Everyday Italian
Giada De Laurentiis
2005
30.00


Harry Potter
J K. Rowling
2005
29.99


Learning XML
Erik T. Ray
2003
39.95

The root element in the example is . All elements in the document are contained within .

The element has 4 children: ,<>, <year>, <price>.</p> <div style='clear: both;'></div> </div> <div class='post-footer'> <div class='post-footer-line post-footer-line-1'> <span class='post-author vcard'> </span> <span class='post-timestamp'> </span> <span class='post-comment-link'> </span> <span class='post-icons'> </span> <div class='post-share-buttons goog-inline-block'> </div> </div> <div class='post-footer-line post-footer-line-2'> <span class='post-labels'> </span> </div> <div class='post-footer-line post-footer-line-3'> <span class='post-location'> </span> </div> </div> </div> <div class='comments' id='comments'> <a name='comments'></a> </div> </div> </div></div> </div> <div class='blog-pager' id='blog-pager'> <span id='blog-pager-newer-link'> <a class='blog-pager-newer-link' href='http://onlinexml.blogspot.com/2008/01/xml-syntax-rules.html' id='Blog1_blog-pager-newer-link' title='Newer Post'>Newer Post</a> </span> <span id='blog-pager-older-link'> <a class='blog-pager-older-link' href='http://onlinexml.blogspot.com/2008/01/how-can-xml-be-used.html' id='Blog1_blog-pager-older-link' title='Older Post'>Older Post</a> </span> <a class='home-link' href='http://onlinexml.blogspot.com/'>Home</a> </div> <div class='clear'></div> <div class='post-feeds'> </div> </div><div class='widget HTML' data-version='1' id='HTML11'> <div class='widget-content'> <div><script type="text/javascript">var addthis_pub="nomigobo";</script> <a onmouseover="return addthis_open(this, '', '[URL]', '[TITLE]')" onmouseout="addthis_close()" href="http://www.addthis.com/bookmark.php" onclick="return addthis_sendto()"><img border="0" width="83" alt="" style="border:0" src="http://s7.addthis.com/static/btn/sm-share-en.gif" height="16"/></a><script src="http://s7.addthis.com/js/152/addthis_widget.js" type="text/javascript"></script></div> </div> <div class='clear'></div> </div><div class='widget HTML' data-version='1' id='HTML8'> <h2 class='title'>Mix it</h2> <div class='widget-content'> <a href="http://www.mixx.com/" onclick="window.location='http://www.mixx.com/submit?page_url='+window.location; return false;"> <img border="0" alt="Add to Mixx!" src="http://www.mixx.com/images/buttons/mixx-button5.png"/> </a> </div> <div class='clear'></div> </div></div> </div> <div id='ads-wrapper'> <div class='sidebar section' id='ads'><div class='widget HTML' data-version='1' id='HTML2'> <div class='widget-content'> <!-- Search Google --> <center> <form action="http://www.google.com/custom" target="google_window" method="get"> <table bgcolor="#ffffff"> <tr><td nowrap="nowrap" valign="top" height="32" align="left"> <a href="http://www.google.com/"> <img border="0" alt="Google" src="http://www.google.com/logos/Logo_25wht.gif" align="middle"/></a> <br/> <label for="sbi" style="display: none">Enter your search terms</label> <input maxlength="255" id="sbi" value="" name="q" size="25" type="text"/> </td></tr> <tr><td valign="top" align="left"> <label for="sbb" style="display: none">Submit search form</label> <input id="sbb" value="Search" name="sa" type="submit"/> <input value="pub-3758486422209903" name="client" type="hidden"/> <input value="1" name="forid" type="hidden"/> <input value="7427465219" name="channel" type="hidden"/> <input value="ISO-8859-1" name="ie" type="hidden"/> <input value="ISO-8859-1" name="oe" type="hidden"/> <input value="GALT:#008000;GL:1;DIV:#336699;VLC:663399;AH:center;BGC:FFFFFF;LBGC:FFFFFF;ALC:0000FF;LC:0000FF;T:000000;GFNT:0000FF;GIMP:0000FF;FORID:1" name="cof" type="hidden"/> <input value="en" name="hl" type="hidden"/> </td></tr></table> </form> </center> <!-- Search Google --> </div> <div class='clear'></div> </div><div class='widget Label' data-version='1' id='Label1'> <h2>Ads</h2> <div class='widget-content list-label-widget-content'> <ul> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Browser%20Display%20Statistics'>Browser Display Statistics</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Browser%20Statistics'>Browser Statistics</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Displaying%20XML%20with%20CSS'>Displaying XML with CSS</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Displaying%20XML%20with%20XSLT'>Displaying XML with XSLT</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Firefox%20Browser'>Firefox Browser</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/HOME'>HOME</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/How%20Can%20XML%20be%20Used%3F'>How Can XML be Used?</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Internet%20Explorer'>Internet Explorer</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Introduction%20to%20XML'>Introduction to XML</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Latest%20Opera%20Releases'>Latest Opera Releases</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Netscape%20Browser'>Netscape Browser</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Now%20What%3F'>Now What?</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/OS%20Platform%20Statistics'>OS Platform Statistics</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Save%20Data%20to%20an%20XML%20File'>Save Data to an XML File</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/The%20Mozilla%20Project'>The Mozilla Project</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/The%20XMLHttpRequest%20Object'>The XMLHttpRequest Object</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/Viewing%20XML%20Files'>Viewing XML Files</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Application'>XML Application</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Attributes'>XML Attributes</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Browser%20Support'>XML Browser Support</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20CDATA'>XML CDATA</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Don%27t'>XML Don't</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Editors'>XML Editors</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Elements'>XML Elements</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Encoding'>XML Encoding</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20in%20Real%20Life'>XML in Real Life</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Namespaces'>XML Namespaces</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20on%20the%20Server'>XML on the Server</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Parser'>XML Parser</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Syntax%20Rules'>XML Syntax Rules</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20to%20HTML'>XML to HTML</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Tree'>XML Tree</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Tutorial'>XML Tutorial</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Validation'>XML Validation</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/XML%20Validator'>XML Validator</a> </li> <li> <a dir='ltr' href='http://onlinexml.blogspot.com/search/label/You%20Have%20Learned%20XML'>You Have Learned XML</a> </li> </ul> <div class='clear'></div> </div> </div><div class='widget HTML' data-version='1' id='HTML1'> <div class='widget-content'> <script type="text/javascript"><!-- google_ad_client = "pub-3758486422209903"; google_ad_host = "pub-1556223355139109"; google_ad_host_channel="00000"; /* sky */ google_ad_slot = "6652862642"; google_ad_width = 160; google_ad_height = 600; google_cpa_choice = ""; // on file //--> </script> <script src="http://pagead2.googlesyndication.com/pagead/show_ads.js" type="text/javascript"> </script> </div> <div class='clear'></div> </div><div class='widget HTML' data-version='1' id='HTML3'> <h2 class='title'>Feeds</h2> <div class='widget-content'> </div> <div class='clear'></div> </div></div> </div> <!-- spacer for skins that want sidebar and main to be the same height --> <div class='clear'> </div> </div> <!-- end content-wrapper --> </div> <div id='footer-wrapper'> <div class='footer section' id='footer'><div class='widget HTML' data-version='1' id='HTML7'> <div class='widget-content'> <!-- Begin: AdBrite --> <script type="text/javascript"> var AdBrite_Title_Color = '0000FF'; var AdBrite_Text_Color = '000000'; var AdBrite_Background_Color = 'FFFFFF'; var AdBrite_Border_Color = 'FFFFFF'; </script> <span style="white-space:nowrap;"><script src="http://ads.adbrite.com/mb/text_group.php?sid=536353&zs=3732385f3930" type="text/javascript"></script><!-- --><a target="_top" href="http://www.adbrite.com/mb/commerce/purchase_form.php?opid=536353&afsid=1"><img border="0" style="background-color:#FFFFFF;border:none;padding:0;margin:0;" alt="Your Ad Here" width="14" src="http://files.adbrite.com/mb/images/adbrite-your-ad-here-leaderboard.gif" height="90"/></a></span> <!-- End: AdBrite --> </div> <div class='clear'></div> </div></div> </div> </div> </div> <!-- end outer-wrapper --> <script type="text/javascript" src="https://www.blogger.com/static/v1/widgets/3878540743-widgets.js"></script> <script type='text/javascript'> window['__wavt'] = 'AOuZoY5vj-Mkjna5doKFIKIr9EQDRTWkNQ:1759606338775';_WidgetManager._Init('//www.blogger.com/rearrange?blogID\x3d7877396581341530968','//onlinexml.blogspot.com/2008/01/xml-tree.html','7877396581341530968'); _WidgetManager._SetDataContext([{'name': 'blog', 'data': {'blogId': '7877396581341530968', 'title': 'Learn XML', 'url': 'http://onlinexml.blogspot.com/2008/01/xml-tree.html', 'canonicalUrl': 'http://onlinexml.blogspot.com/2008/01/xml-tree.html', 'homepageUrl': 'http://onlinexml.blogspot.com/', 'searchUrl': 'http://onlinexml.blogspot.com/search', 'canonicalHomepageUrl': 'http://onlinexml.blogspot.com/', 'blogspotFaviconUrl': 'http://onlinexml.blogspot.com/favicon.ico', 'bloggerUrl': 'https://www.blogger.com', 'hasCustomDomain': false, 'httpsEnabled': true, 'enabledCommentProfileImages': true, 'gPlusViewType': 'FILTERED_POSTMOD', 'adultContent': false, 'analyticsAccountNumber': '', 'encoding': 'UTF-8', 'locale': 'en-US', 'localeUnderscoreDelimited': 'en', 'languageDirection': 'ltr', 'isPrivate': false, 'isMobile': false, 'isMobileRequest': false, 'mobileClass': '', 'isPrivateBlog': false, 'isDynamicViewsAvailable': true, 'feedLinks': '\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22Learn XML - Atom\x22 href\x3d\x22http://onlinexml.blogspot.com/feeds/posts/default\x22 /\x3e\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/rss+xml\x22 title\x3d\x22Learn XML - RSS\x22 href\x3d\x22http://onlinexml.blogspot.com/feeds/posts/default?alt\x3drss\x22 /\x3e\n\x3clink rel\x3d\x22service.post\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22Learn XML - Atom\x22 href\x3d\x22https://www.blogger.com/feeds/7877396581341530968/posts/default\x22 /\x3e\n\n\x3clink rel\x3d\x22alternate\x22 type\x3d\x22application/atom+xml\x22 title\x3d\x22Learn XML - Atom\x22 href\x3d\x22http://onlinexml.blogspot.com/feeds/6929743298446084780/comments/default\x22 /\x3e\n', 'meTag': '', 'adsenseClientId': 'ca-pub-3758486422209903', 'adsenseHostId': 'ca-host-pub-1556223355139109', 'adsenseHasAds': true, 'adsenseAutoAds': false, 'boqCommentIframeForm': true, 'loginRedirectParam': '', 'view': '', 'dynamicViewsCommentsSrc': '//www.blogblog.com/dynamicviews/4224c15c4e7c9321/js/comments.js', 'dynamicViewsScriptSrc': '//www.blogblog.com/dynamicviews/00d5921fb137c39b', 'plusOneApiSrc': 'https://apis.google.com/js/platform.js', 'disableGComments': true, 'interstitialAccepted': false, 'sharing': {'platforms': [{'name': 'Get link', 'key': 'link', 'shareMessage': 'Get link', 'target': ''}, {'name': 'Facebook', 'key': 'facebook', 'shareMessage': 'Share to Facebook', 'target': 'facebook'}, {'name': 'BlogThis!', 'key': 'blogThis', 'shareMessage': 'BlogThis!', 'target': 'blog'}, {'name': 'X', 'key': 'twitter', 'shareMessage': 'Share to X', 'target': 'twitter'}, {'name': 'Pinterest', 'key': 'pinterest', 'shareMessage': 'Share to Pinterest', 'target': 'pinterest'}, {'name': 'Email', 'key': 'email', 'shareMessage': 'Email', 'target': 'email'}], 'disableGooglePlus': true, 'googlePlusShareButtonWidth': 0, 'googlePlusBootstrap': '\x3cscript type\x3d\x22text/javascript\x22\x3ewindow.___gcfg \x3d {\x27lang\x27: \x27en\x27};\x3c/script\x3e'}, 'hasCustomJumpLinkMessage': false, 'jumpLinkMessage': 'Read more', 'pageType': 'item', 'postId': '6929743298446084780', 'postImageUrl': 'http://www.w3schools.com/xml/nodetree.gif', 'pageName': 'XML Tree', 'pageTitle': 'Learn XML: XML Tree'}}, {'name': 'features', 'data': {}}, {'name': 'messages', 'data': {'edit': 'Edit', 'linkCopiedToClipboard': 'Link copied to clipboard!', 'ok': 'Ok', 'postLink': 'Post Link'}}, {'name': 'template', 'data': {'name': 'custom', 'localizedName': 'Custom', 'isResponsive': false, 'isAlternateRendering': false, 'isCustom': true}}, {'name': 'view', 'data': {'classic': {'name': 'classic', 'url': '?view\x3dclassic'}, 'flipcard': {'name': 'flipcard', 'url': '?view\x3dflipcard'}, 'magazine': {'name': 'magazine', 'url': '?view\x3dmagazine'}, 'mosaic': {'name': 'mosaic', 'url': '?view\x3dmosaic'}, 'sidebar': {'name': 'sidebar', 'url': '?view\x3dsidebar'}, 'snapshot': {'name': 'snapshot', 'url': '?view\x3dsnapshot'}, 'timeslide': {'name': 'timeslide', 'url': '?view\x3dtimeslide'}, 'isMobile': false, 'title': 'XML Tree', 'description': 'ML documents form a tree structure that starts at \x22the root\x22 and branches to \x22the leaves\x22. An Example XML Document XML documents use a...', 'featuredImage': 'https://lh3.googleusercontent.com/blogger_img_proxy/AEn0k_srTiUcPYqiBZA1yrinRbA8tjaYuWw6HF5K0-0ABVLrBKa05FqybjvRAdRjqPMrBl6tA32_viGKh3FlY-puvkqyiuzw8th51c47TAX5', 'url': 'http://onlinexml.blogspot.com/2008/01/xml-tree.html', 'type': 'item', 'isSingleItem': true, 'isMultipleItems': false, 'isError': false, 'isPage': false, 'isPost': true, 'isHomepage': false, 'isArchive': false, 'isLabelSearch': false, 'postId': 6929743298446084780}}]); _WidgetManager._RegisterWidget('_NavbarView', new _WidgetInfo('Navbar1', 'navbar', document.getElementById('Navbar1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HeaderView', new _WidgetInfo('Header1', 'header', document.getElementById('Header1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML10', 'sidebar', document.getElementById('HTML10'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML9', 'sidebar', document.getElementById('HTML9'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_AdSenseView', new _WidgetInfo('AdSense1', 'sidebar', document.getElementById('AdSense1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML4', 'sidebar', document.getElementById('HTML4'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogArchiveView', new _WidgetInfo('BlogArchive1', 'sidebar', document.getElementById('BlogArchive1'), {'languageDirection': 'ltr', 'loadingMessage': 'Loading\x26hellip;'}, 'displayModeFull')); _WidgetManager._RegisterWidget('_AdSenseView', new _WidgetInfo('AdSense3', 'sidebar', document.getElementById('AdSense3'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_ProfileView', new _WidgetInfo('Profile1', 'sidebar', document.getElementById('Profile1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_AdSenseView', new _WidgetInfo('AdSense2', 'main', document.getElementById('AdSense2'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_BlogView', new _WidgetInfo('Blog1', 'main', document.getElementById('Blog1'), {'cmtInteractionsEnabled': false, 'lightboxEnabled': true, 'lightboxModuleUrl': 'https://www.blogger.com/static/v1/jsbin/52802623-lbx.js', 'lightboxCssUrl': 'https://www.blogger.com/static/v1/v-css/828616780-lightbox_bundle.css'}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML11', 'main', document.getElementById('HTML11'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML8', 'main', document.getElementById('HTML8'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML2', 'ads', document.getElementById('HTML2'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_LabelView', new _WidgetInfo('Label1', 'ads', document.getElementById('Label1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML1', 'ads', document.getElementById('HTML1'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML3', 'ads', document.getElementById('HTML3'), {}, 'displayModeFull')); _WidgetManager._RegisterWidget('_HTMLView', new _WidgetInfo('HTML7', 'footer', document.getElementById('HTML7'), {}, 'displayModeFull')); </script> </body> </html>