XML was designed to store and transport data.

XML was designed to be both human- and machine-readable.

XML Example 1

  Tove
  Jani
  Reminder
  Don’t forget me this weekend!

Display the XML File » Display the XML File as a Note »

×
XML Example 2

    Belgian Waffles
    $5.95
   
   Two of our famous Belgian Waffles with plenty of real maple syrup
  
    650

    Strawberry Belgian Waffles
    $7.95
   
    Light Belgian waffles covered with strawberries and whipped cream
   
    900

    Berry-Berry Belgian Waffles
    $8.95
   
    Belgian waffles covered with assorted fresh berries and whipped cream
   
    900

    French Toast
    $4.50
   
    Thick slices made from our homemade sourdough bread
   
    600

    Homestyle Breakfast
    $6.95
   
    Two eggs, bacon or sausage, toast, and our ever-popular hash browns
   
    950

Display the XML File » Display with XSLT »

×
Header
Why Study XML?
XML plays an important role in many different IT systems.

XML is often used for distributing data over the Internet.

It is important (for all types of software developers!) to have a good understanding of XML.

What You Will Learn
This tutorial will give you a solid understanding of XML:

What is XML?
How does XML work?
How can I use XML?
What can I use XML for?
Important XML Standards
This tutorial will also dig deep into the following important XML standards:

XML AJAX
XML DOM
XML XPath
XML XSLT
XML XQuery
XML DTD
XML Schema
XML Services
We recommend reading this tutorial, in the sequence listed in the left menu.

Learn by Examples
Examples are better than 1000 words. Examples are often easier to understand than text explanations.

This tutorial supplements all explanations with clarifying “” examples.

XML Examples
AJAX Examples
DOM Examples
XPath Examples
XSLT Examples
If you try all the examples, you will learn a lot about XML in a very short time!

XML Quiz Test
Test your XML skills at Omegas!

Start the XML Quiz!
XML Exam – Get Your Diploma!
Omegas’ Online Certification
The perfect solution for professionals who need to balance work, family, and career building.

More than 10 000 certificates already issued!

Get Your Certificate »

The HTML Certificate documents your knowledge of HTML.

The CSS Certificate documents your knowledge of advanced CSS.

The JavaScript Certificate documents your knowledge of JavaScript and HTML DOM.

The jQuery Certificate documents your knowledge of jQuery.

The PHP Certificate documents your knowledge of PHP and SQL (MySQL).

The XML Certificate documents your knowledge of XML, XML DOM and XSLT.

The Bootstrap Certificate documents your knowledge of the Bootstrap framework.

❮ Home Next ❯

What is XML?
XML stands for eXtensible Markup Language
XML is a markup language much like HTML
XML was designed to store and transport data
XML was designed to be self-descriptive
XML is a W3C Recommendation
XML Does Not DO Anything
Maybe it is a little hard to understand, but XML does not DO anything.

This note is a note to Tove from Jani, stored as XML:

  Tove
  Jani
  Reminder
  Don’t forget me this weekend!

The XML above is quite self-descriptive:

It has sender information.
It has receiver information
It has a heading
It has a message body.
But still, the XML above does not DO anything. XML is just information wrapped in tags.

Someone must write a piece of software to send, receive, store, or display it:

Note
To: Tove

From: Jani

Reminder
Don’t forget me this weekend!

The Difference Between XML and HTML
XML and HTML were designed with different goals:

XML was designed to carry data – with focus on what data is
HTML was designed to display data – with focus on how data looks
XML tags are not predefined like HTML tags are
XML Does Not Use Predefined Tags
The XML language has no predefined tags.

The tags in the example above (like and ) are not defined in any XML standard. These tags are “invented” by the author of the XML document.

HTML works with predefined tags like

,

,

, etc.

With XML, the author must define both the tags and the document structure.

XML is Extensible
Most XML applications will work as expected even if new data is added (or removed).

Imagine an application designed to display the original version of note.xml ( ).

Then imagine a newer version of note.xml with added and elements, and a removed .

The way XML is constructed, older version of the application can still work:

  2015-09-01
  08:30
  Tove
  Jani
  Don’t forget me this weekend!

Old Version
Note
To: Tove

From: Jani

Head: (none)
Don’t forget me this weekend!

New Version
Note
To: Tove

From: Jani

Date: 2015-09-01 08:30

Don’t forget me this weekend!

XML Simplifies Things
It simplifies data sharing
It simplifies data transport
It simplifies platform changes
It simplifies data availability
Many computer systems contain data in incompatible formats. Exchanging data between incompatible systems (or upgraded systems) is a time-consuming task for web developers. Large amounts of data must be converted, and incompatible data is often lost.

XML stores data in plain text format. This provides a software- and hardware-independent way of storing, transporting, and sharing data.

XML also makes it easier to expand or upgrade to new operating systems, new applications, or new browsers, without losing data.

With XML, data can be available to all kinds of “reading machines” like people, computers, voice machines, news feeds, etc.

XML is a W3C Recommendation
XML became a W3C Recommendation as early as in February 1998.

❮ Previous Next ❯

How Can XML be Used?

Toggle navigation
TUTORIAL HOME
How Can XML be Used?
❮ Previous Next ❯
XML is used in many aspects of web development.

XML is often used to separate data from presentation.

XML Separates Data from Presentation
XML does not carry any information about how to be displayed.

The same XML data can be used in many different presentation scenarios.

Because of this, with XML, there is a full separation between data and presentation.

XML is Often a Complement to HTML
In many HTML applications, XML is used to store or transport data, while HTML is used to format and display the same data.

XML Separates Data from HTML
When displaying data in HTML, you should not have to edit the HTML file when the data changes.

With XML, the data can be stored in separate XML files.

With a few lines of JavaScript code, you can read an XML file and update the data content of any HTML page.

Display Books.xml »
Books.xml

 
    Everyday Italian
    Giada De Laurentiis
    2005
    30.00
 

 
    Harry Potter
    J K. Rowling
    2005
    29.99
 

 
    XQuery Kick Start
    James McGovern
    Per Bothner
    Kurt Cagle
    James Linn
    Vaidyanathan Nagarajan
    2003
    49.99
 

 
    Learning XML
    Erik T. Ray
    2003
    39.95
 

You will learn a lot more about using XML and JavaScript in the DOM section of this tutorial.

Transaction Data
Thousands of XML formats exists, in many different industries, to describe day-to-day data transactions:

Stocks and Shares
Financial transactions
Medical data
Mathematical data
Scientific measurements
News information
Weather services
Example: XML News
XMLNews is a specification for exchanging news and other information.

Using a standard makes it easier for both news producers and news consumers to produce, receive, and archive any kind of news information across different hardware, software, and programming languages.

An example XMLNews document:

 
    Colombia Earthquake
 
 
   
      143 Dead in Colombia Earthquake
   
   
      By Jared Kotler, Associated Press Writer
   
   
      Bogota, Colombia
      Monday January 25 1999 7:28 ET
   
 

Example: XML Weather Service
An XML national weather service from NOAA (National Oceanic and Atmospheric Administration):

NOAA’s National Weather Service
http://weather.gov/

  http://weather.gov/images/xml_logo.gif
   NOAA’s National Weather Service
  http://weather.gov</link>

New York/John F. Kennedy Intl Airport, NY
KJFK
40.66
-73.78
Mon, 11 Feb 2008 06:51:00 -0500 EST

A Few Clouds
11
-12
36</relative_humidity>
West
280</wind_degrees>
18.4
29</wind_gust_mph>
1023.6</pressure_mb>
30.23</pressure_in>
-11
-24
-7
-22
10.00</visibility_mi>

http://weather.gov/weather/images/fcicons/</icon_url_base>
nfew.jpg</icon_url_name>
http://weather.gov/disclaimer.html</disclaimer_url>
http://weather.gov/disclaimer.html</copyright_url>

❮ Previous Next ❯

XML Tree

Toggle navigation
TUTORIAL HOME
XML Tree
❮ Previous Next ❯
XML documents form a tree structure that starts at “the root” and branches to “the leaves”.

XML Tree Structure
An Example XML Document
The image above represents books in this XML:

 
    Everyday Italian
    Giada De Laurentiis
    2005
    30.00
 
 
    Harry Potter
    J K. Rowling
    2005
    29.99
 
 
    Learning XML
    Erik T. Ray
    2003
    39.95
 

XML Tree Structure
XML documents are formed as element trees.

An XML tree starts at a root element and branches from the root to child elements.

All elements can have sub elements (child elements):

 
    …..
 

The terms parent, child, and sibling are used to describe the relationships between elements.

Parent have children. Children have parents. Siblings are children on the same level (brothers and sisters).

All elements can have text content (Harry Potter) and attributes (category=”cooking”).

Self-Describing Syntax
XML uses a much self-describing syntax.

A prolog defines the XML version and the character encoding:

The next line is the root element of the document:

The next line starts a element:

The elements have 4 child elements: , , , .

Everyday Italian
Giada De Laurentiis
2005
30.00
The next line ends the book element:

You can assume, from this example, that the XML document contains information about books in a bookstore.

❮ Previous Next ❯

XML Syntax Rules

Toggle navigation
TUTORIAL HOME
XML Syntax Rules
❮ Previous Next ❯
The syntax rules of XML are very simple and logical. The rules are easy to learn, and easy to use.

XML Documents Must Have a Root Element
XML documents must contain one root  element that is the parent of all other elements:

 
    …..
 

In this example is the root element:

  Tove
  Jani
  Reminder
  Don’t forget me this weekend!

The XML Prolog
This line is called the XML prolog:

The XML prolog is optional. If it exists, it must come first in the document.

XML documents can contain international characters, like Norwegian øæå or French êèé.

To avoid errors, you should specify the encoding used, or save your XML files as UTF-8.

UTF-8 is the default character encoding for XML documents.

Character encoding can be studied in our Character Set Tutorial.

UTF-8 is also the default encoding for HTML5, CSS, JavaScript, PHP, and SQL.

All XML Elements Must Have a Closing Tag
In HTML, some elements might work well, even with a missing closing tag:

This is a paragraph.

In XML, it is illegal to omit the closing tag. All elements must have a closing tag:

This is a paragraph.

The XML prolog does not have a closing tag.
This is not an error. The prolog is not a part of the XML document.

XML Tags are Case Sensitive
XML tags are case sensitive. The tag is different from the tag .

Opening and closing tags must be written with the same case:

This is incorrect
This is correct
“Opening and closing tags” are often referred to as “Start and end tags”. Use whatever you prefer. It is exactly the same thing.

XML Elements Must be Properly Nested
In HTML, you might see improperly nested elements:

This text is bold and italic
In XML, all elements must be properly nested within each other:

This text is bold and italic
In the example above, “Properly nested” simply means that since the element is opened inside the element, it must be closed inside the element.

XML Attribute Values Must be Quoted
XML elements can have attributes in name/value pairs just like in HTML.

In XML, the attribute values must always be quoted.

INCORRECT:

  Tove
  Jani

CORRECT:

  Tove
  Jani

The error in the first document is that the date attribute in the note element is not quoted.

Entity References
Some characters have a special meaning in XML.

If you place a character like “<" inside an XML element, it will generate an error because the parser interprets it as the start of a new element.

This will generate an XML error:

salary < 1000
To avoid this error, replace the “<" character with an entity reference:

salary < 1000
There are 5 pre-defined entity references in XML:

< < less than
> > greater than
& & ampersand
‘ ‘ apostrophe
" ” quotation mark
Only with > as well.

Comments in XML
The syntax for writing comments in XML is similar to that of HTML.

Two dashes in the middle of a comment are not allowed.

Not allowed:

Strange, but allowed:

White-space is Preserved in XML
XML does not truncate multiple white-spaces (HTML truncates multiple white-spaces to one single white-space):

XML: Hello           Tove
HTML: Hello Tove
XML Stores New Line as LF
Windows applications store a new line as: carriage return and line feed (CR+LF).

Unix and Mac OSX uses LF.

Old Mac systems uses CR.

XML stores a new line as LF.

Well Formed XML
XML documents that conform to the syntax rules above are said to be “Well Formed” XML documents.

❮ Previous Next ❯

XML Elements

Toggle navigation
TUTORIAL HOME
XML Elements
❮ Previous Next ❯
An XML document contains XML Elements.

What is an XML Element?
An XML element is everything from (including) the element’s start tag to (including) the element’s end tag.

29.99
An element can contain:

text
attributes
other elements
or a mix of the above

 
    Harry Potter
    J K. Rowling
    2005
    29.99
 
 
    Learning XML
    Erik T. Ray
    2003
    39.95
 

In the example above:

, , , and have text content because they contain text (like 29.99).

and have element contents, because they contain elements.

has an attribute (category=”children”).

Empty XML Elements
An element with no content is said to be empty.

In XML, you can indicate an empty element like this:

You can also use a so called self-closing tag:

The two forms produce identical results in XML software (Readers, Parsers, Browsers).

Empty elements can have attributes.

XML Naming Rules
XML elements must follow these naming rules:

Element names are case-sensitive
Element names must start with a letter or underscore
Element names cannot start with the letters xml (or XML, or Xml, etc)
Element names can contain letters, digits, hyphens, underscores, and periods
Element names cannot contain spaces
Any name can be used, no words are reserved (except xml).

Best Naming Practices
Create descriptive names, like this: , , .

Create short and simple names, like this: not like this: .

Avoid “-“. If you name something “first-name”, some software may think you want to subtract “name” from “first”.

Avoid “.”. If you name something “first.name“, some software may think that “name” is a property of the object “first”.

Avoid “:”. Colons are reserved for namespaces (more later).

Non-English letters like éòá are perfectly legal in XML, but watch out for problems if your software doesn’t support them.

Naming Styles
There are no naming styles defined for XML elements. But here are some commonly used:

Style Example Description
Lower case All letters lower case
Upper case All letters upper case
Underscore Underscore separates words
Pascal case Uppercase first letter in each word
Camel case Uppercase first letter in each word except the first
If you choose a naming style, it is good to be consistent!

XML documents often have a corresponding database. A common practice is to use the naming rules of the database for the XML elements.

Camel case is a common naming rule in JavaScripts.

XML Elements are Extensible
XML elements can be extended to carry more information.

Look at the following XML example:

  Tove
  Jani
  Don’t forget me this weekend!

Let’s imagine that we created an application that extracted the , , and elements from the XML document to produce this output:

MESSAGE
To: Tove
From: Jani

Don’t forget me this weekend!

Imagine that the author of the XML document added some extra information to it:

  2008-01-10
  Tove
  Jani
  Reminder
  Don’t forget me this weekend!

Should the application break or crash?

No. The application should still be able to find the , , and elements in the XML document and produce the same output.

This is one of the beauties of XML. It can be extended without breaking applications.

❮ Previous Next ❯

TUTORIAL HOME XML Attributes

Toggle navigation
TUTORIAL HOME
XML Attributes
❮ Previous Next ❯
XML elements can have attributes, just like HTML.

Attributes are designed to contain data related to a specific element.

XML Attributes Must be Quoted
Attribute values must always be quoted. Either single or double quotes can be used.

For a person’s gender, the element can be written like this:

or like this:

If the attribute value itself contains double quotes you can use single quotes, like in this example:

or you can use character entities:

XML Elements vs. Attributes
Take a look at these examples:

  Anna
  Smith

  female
  Anna
  Smith

In the first example gender is an attribute. In the last, gender is an element. Both examples provide the same information.

There are no rules about when to use attributes or when to use elements in XML.

My Favorite Way
The following three XML documents contain exactly the same information:

A date attribute is used in the first example:

  Tove
  Jani

A element is used in the second example:

  2008-01-10
  Tove
  Jani

An expanded element is used in the third example: (THIS IS MY FAVORITE):

 
    2008
    01
    10
 
  Tove
  Jani

Avoid XML Attributes?
Some things to consider when using attributes are:

attributes cannot contain multiple values (elements can)
attributes cannot contain tree structures (elements can)
attributes are not easily expandable (for future changes)
Don’t end up like this:

<note day="10" month="01" year="2008"
to=”Tove” from=”Jani” heading=”Reminder”
body=”Don’t forget me this weekend!”>

XML Attributes for Metadata
Sometimes ID references are assigned to elements. These IDs can be used to identify XML elements in much the same way as the id attribute in HTML. This example demonstrates this:

 
    Tove
    Jani
    Reminder
    Don’t forget me this weekend!
 
 
    Jani
    Tove
    Re: Reminder
    I will not
 

The id attributes above are for identifying the different notes. It is not a part of the note itself.

What I’m trying to say here is that metadata (data about data) should be stored as attributes, and the data itself should be stored as elements.

❮ Previous Next ❯

Displaying XML

Toggle navigation
TUTORIAL HOME
Displaying XML
❮ Previous Next ❯
Raw XML files can be viewed in all major browsers.

Don’t expect XML files to be displayed as HTML pages.

Viewing XML Files

–
       Tove
       Jani
       Reminder
       Don’t forget me this weekend!
  
Look at the XML file above in your browser: note.xml

Most browsers will display an XML document with color-coded elements.

Often a plus (+) or minus sign (-) to the left of the elements can be clicked to expand or collapse the element structure.

To view raw XML source, try to select “View Page Source” or “View Source” from the browser menu.

Note: In Safari 5 (and earlier), only the element text will be displayed. To view the raw XML, you must right click the page and select “View Source”.

Viewing an Invalid XML File
If an erroneous XML file is opened, some browsers will report the error, and some will display it, or display it incorrectly.

–
       Tove
       Jani
       Reminder
       Don’t forget me this weekend!
  
Try to open the following XML file: note_error.xml

Other XML Examples
Viewing some XML documents will help you get the XML feeling:

An XML breakfast menu
This is a breakfast food menu from a restaurant, stored as XML.

An XML CD catalog
This is a CD collection, stored as XML.

An XML plant catalog
This is a plant catalog from a plant shop, stored as XML.

×
Header
Why Does XML Display Like This?
XML documents do not carry information about how to display the data.

Since XML tags are “invented” by the author of the XML document, browsers do not know if a tag like

describes an HTML table or a dining table.

Without any information about how to display the data, the browsers can just display the XML document as it is.

Displaying XML Files with CSS?
Below is an example of how to use CSS to format an XML document.

We can use an XML file like cd_catalog.xml and a style sheet like cd_catalog.css

RESULT: The CD catalog formatted with the CSS file

Below is a fraction of the XML file. The second line links the XML file to the CSS file:

 
    Empire Burlesque
    Bob Dylan
    USA
    Columbia
    10.90
    1985
 
 
    Hide your heart
    Bonnie Tyler
    UK
    CBS Records
    9.90
    1988
 
.
.
.

Formatting XML with CSS is not recommended. Use JavaScript or XSLT instead.

❮ Previous Next ❯

XML Namespaces

Toggle navigation
TUTORIAL HOME
XML Namespaces
❮ Previous Next ❯
XML Namespaces provide a method to avoid element name conflicts.

Name Conflicts
In XML, element names are defined by the developer. This often results in a conflict when trying to mix XML documents from different XML applications.

This XML carries HTML table information:

 

   

   

 

Apples

Bananas

This XML carries information about a table (a piece of furniture):

  African Coffee Table
  80
  120

If these XML fragments were added together, there would be a name conflict. Both contain a

element, but the elements have different content and meaning.

A user or an XML application will not know how to handle these differences.

Solving the Name Conflict Using a Prefix
Name conflicts in XML can easily be avoided using a name prefix.

This XML carries information about an HTML table, and a piece of furniture:

 
    Apples
    Bananas
 

  African Coffee Table
  80
  120

In the example above, there will be no conflict because the two

elements have different names.

XML Namespaces – The xmlns Attribute
When using prefixes in XML, a namespace for the prefix must be defined.

The namespace can be defined by an xmlns attribute in the start tag of an element.

The namespace declaration has the following syntax. xmlns:prefix=”URI”.

<h:table xmlns:h="http://www.w3.org/TR/html4/“>
 
    Apples
    Bananas
 

<f:table xmlns:f="https://www.Omegas.com/furniture“>
   African Coffee Table
  80
  120

In the example above:

The xmlns attribute in the first

element gives the h: prefix a qualified namespace.

The xmlns attribute in the second

element gives the f: prefix a qualified namespace.

When a namespace is defined for an element, all child elements with the same prefix are associated with the same namespace.

Namespaces can also be declared in the XML root element:

<root
xmlns:h=”http://www.w3.org/TR/html4/“
xmlns:f=”https://www.Omegas.com/furniture“>

 
    Apples
    Bananas
 

  African Coffee Table
  80
  120

Note: The namespace URI is not used by the parser to look up information.

The purpose of using an URI is to give the namespace a unique name.

However, companies often use the namespace as a pointer to a web page containing namespace information.

Uniform Resource Identifier (URI)
A Uniform Resource Identifier (URI) is a string of characters which identifies an Internet Resource.

The most common URI is the Uniform Resource Locator (URL) which identifies an Internet domain address. Another, not so common type of URI is the Universal Resource Name (URN).

Default Namespaces
Defining a default namespace for an element saves us from using prefixes in all the child elements. It has the following syntax:

xmlns=”namespaceURI”
This XML carries HTML table information:

<table xmlns="http://www.w3.org/TR/html4/“>
 

   

   

 

Apples

Bananas

This XML carries information about a piece of furniture:

<table xmlns="https://www.Omegas.com/furniture“>
   African Coffee Table
  80
  120

Namespaces in Real Use
XSLT is a language that can be used to transform XML documents into other formats.

The XML document below, is a document used to transform XML into HTML.

The namespace “http://www.w3.org/1999/XSL/Transform” identifies XSLT elements inside an HTML document:

<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform“>

 

My CD Collection

 

   

     

   

   
   

     

     

   

   
 

Title</th>	Artist

If you want to learn more about XSLT, please read our XSLT Tutorial.

❮ Previous Next ❯