Home arrow XML arrow The Why and How of XML Data Islands

The Why and How of XML Data Islands

This article explains a useful way to embed data in an HTML document, and store it on the client, using XML. With XML becoming ever more pervasive and the client side implementation gaining a lot of ground, you will probably find yourself using this technique in many projects.

Author Info:
By: Jayaram Krishnaswamy
Rating: 5 stars5 stars5 stars5 stars5 stars / 28
July 19, 2006
  1. · The Why and How of XML Data Islands
  2. · Getting the names of students
  3. · Showing the complete data
  4. · HTML tags that can be bound to an XML island

print this article

The Why and How of XML Data Islands
(Page 1 of 4 )


What is an XML data island? Simply stated it is data in the form of XML embedded in an HTML document. By embedding XML data you create an XML data island, thereby storing your data on the client. This is not good enough. You also want to know how to access it. The HTML elements on the page can be bound to the XML data island and make them come to life, on the client. In reality an XML data island represents a built-in Data Source Object in the IE browser. This means you do not need <object/> tags to embed the control.

Example describing an XML data island

First of all, to get a handle on XML data islands, let us start with a simple HTML file, Simple.htm, with some embedded XML. Of course, you can create your own XML file, but for this tutorial please follow the code shown in the next paragraph. For the embedded XML file, the webstudents.xml file used in my other tutorials will be used. This is how this XML is displayed by the parser on the IE. In the HTML file the XML data island is a different color.


<BODY> <h3>Html file with embedded XML</h3> <P>Here begins the XML Data Island</P>   <xml id="WebStudents"> <wclass> <!-- My students who attended my web programming class --> <student id="1"> <name>Linda Jones</name> <legacySkill>Access, VB5.0</legacySkill> </student> <student id="2"> <name>Adam Davidson</name> <legacySkill>Cobol, MainFrame</legacySkill> </student> <student id="3"> <name>Charles Boyer</name> <legacySkill>HTML, Photoshop</legacySkill> </student> <student id="4"> <name>Charles Mann</name> <legacySkill>Cobol, MainFrame</legacySkill> </student> </wclass> </xml>  <P>Here ends the XML Data Island</P> </BODY> </HTML>

When you display this page in the browser, what you will see is only this. There is nothing to indicate that something is embedded.


If you review the embedded XML file you notice that it has an id called "WebStudents." You also notice that it has well formed XML content. The data content of this file includes the student ids, student names and their skill sets.

blog comments powered by Disqus

- Open XML Finally Supported by MS Office
- XML Features Added to Two Systems
- Using Regions with XSL Formatting Objects
- Using XSL Formatting Objects
- More Schematron Features
- Schematron Patterns and Validation
- Using Schematron
- Datatypes and More in RELAX NG
- Providing Options in RELAX NG
- An Introduction to RELAX NG
- Path, Predicates, and XQuery
- Using Predicates with XQuery
- Navigating Input Documents Using Paths
- XML Basics
- Introduction to XPath

Watch our Tech Videos 
Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Write For Us 
Weekly Newsletter
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 

Developer Shed Affiliates


© 2003-2018 by Developer Shed. All rights reserved. DS Cluster - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials