22
SE2840 Dr. Mark L. Hornick 1 XML: Separating presentation from content Defining your own markup language
SE2840Dr. Mark L. Hornick
1
XML: Separating presentationfrom content
Defining your own markup language
SE2840 Dr. Mark L. Hornick
2
XML: EXtensible Markup Language
XML is a technology for defining markup languages a meta markup language designed to define structured data descriptions
that are portable across languages, platforms, and OS’s
SE2840 Dr. Mark L. Hornick
3
XML allows you to define your own markup language
You define your own tags Tag vocabulary
XML uses a DTD (Document Type Definition) or XSD (XML Schema Defn) to formally describe the data How tags can nest What attributes a tag can/must have i.e. tag grammar
Data that is described by a specified vocabulary & grammar is called an XML Application
SE2840 Dr. Mark L. Hornick
4
(X)HTML is an XML application
(X)HTML is a description of data in web page documents, and how it is structured
(X)HTML is described by XML DTD Actually, several:
Strict Transitional Frameset
SE2840 Dr. Mark L. Hornick
5
XML schemas define how (X)HTML can be structured (for instance, a <title> can appear within a <head>, but not within a <body>)
html
h1
headbody
strong
p
title
p
em
p
em
em
strong
SE2840 Dr. Mark L. Hornick
6
What else is XML good for?XML can be used as a format for storing data in files in a structured manner Separating content from presentation, so
that data created by an application written in Java can be read by an application written in C (or Javascript, or any other language)
Scenario
Consider a Java collection of Students:List<Student> students;
where
public class Student {
String firstname;
String lastname;
int id;
String program;
}
SE2840 Dr. Mark L. Hornick
7
In Java, we can use serialization to write/store students to a file, to be read (later) by another Java application
Provided the other Java application knows the definition of Student and List
It would be much more difficult for a program written in C or some other language (JavaScript) to read the file
Further complications arise when the file is read by an application running on another HW or OS platform
SE2840 Dr. Mark L. Hornick
8
XML allows us to create a document that can be used to represent a portable collection of Students: <?xml version="1.0" encoding="ISO-8859-1"?>
<student_list>
<student>
<firstname>Bill</firstname>
<lastname>Bored</lastname>
<id>1111</id>
<program>SE</program>
</student>
<student>
<firstname>Bob</firstname>
<lastname>Sledd</lastname>
<id>1112</id>
<program>CE</program>
</student>
</student_list>
SE2840 Dr. Mark L. Hornick
9
XML grammars (like the one here) represent all data in plain text, which is most easily interpreted across platforms
The XML grammar itself may be defined by an XML Schema Definition (or a Document Type Defintion/DTD)
<xs:schema targetNamespace="urn:StudentFileSchema" xmlns="urn:StudentFileSchema" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
<xs:element name="student_list">
<xs:complexType >
<xs:element name="student" minOccurs="1">
<xs:complexType>
<xs:sequence>
<xs:element name="firstname" type="xs:string" minOccurs="1" maxOccurs="1">
<xs:element name="lastname" type="xs:string" minOccurs="1" maxOccurs="1"/>
<xs:element name="id" type="xs:integer" minOccurs="1" maxOccurs="1">
<xs:element name="program" type="xs:string" minOccurs="1" maxOccurs="1"/>
<xs:sequence>
</xs:complexType>
</xs:element>
</xs:complexType>
</xs:element>
</xs:schema>
SE2840 Dr. Mark L. Hornick
10
XML Schema Definitions (like the one here) define the valid format of the XML data.For instance the <xs:sequence> tag specifies that the firstname…program tags MUST appear in only that sequence
Here is another XML document that can be used to represent a portable collection of Students: <?xml version="1.0" encoding="ISO-8859-1"?>
<student_list>
<student firstname=“Bill” lastname=“Bored”
id=“1111” program=“SE”
</student>
<student firstname=“Bob” lastname=“Sledd”
id=“1114” program=“CE”
</student>
</student_list>
SE2840 Dr. Mark L. Hornick
11
Note that this grammar defines firstname…program as attributes instead of child elements
The XML Schema Definition for the alternate grammar:
<xs:schema targetNamespace="urn:StudentFileSchema" xmlns="urn:StudentFileSchema" xmlns:xs="http://www.w3.org/2001/XMLSchema" xmlns:msdata="urn:schemas-microsoft-com:xml-msdata">
<xs:element name="student_list">
<xs:complexType >
<xs:element name="student" minOccurs="1">
<xs:complexType>
<xs:sequence>
<xs:attribute name="firstname" type="xs:string" />
<xs:attribute name="lastname" type="xs:string" />
<xs:attribute name="id" type="xs:integer" />
<xs:attribute name="program" type="xs:string“ />
<xs:sequence>
</xs:complexType>
</xs:element>
</xs:complexType>
</xs:element>
</xs:schema>
SE2840 Dr. Mark L. Hornick
12
SE2840 Dr. Mark L. Hornick
13
What is XML good for?XML can be used to define the format to exchange information in a “neutral” format that is language and platform independent Javascript/AJAX can request a complex
response in XML format, rather than as text
How do you read the data from an XML document?
Most languages have XML Parsers that can navigate the elements of an XML file and retrieve the elements’ values
XML Parsers can be “told” to use the XML Schema to ensure that the XML file being parsed is in a valid format Validation is optional; you can create XML files
without creating an XML Schema, but then you have no way of constraining the syntax
SE2840 Dr. Mark L. Hornick
14
Javascript has a built-in XML parser that parses the XML returned by an AJAX request into a navigable tree
<?xml version="1.0" encoding="ISO-8859-1"?>
<student_list>
<student>
<firstname>Bill</firstname>
<lastname>Bored</lastname>
<id>1111</id>
<program>SE</program>
</student>
<student>
<firstname>Bob</firstname>
<lastname>Bored</lastname>
<id>1112</id>
<program>SE</program>
</student>
</student_list>
SE2840 Dr. Mark L. Hornick
15
var xml = xhr.responseXML; // responseXML is above XML textvar students = xml.getElementsByTagName(“student”); // student arrayvar firstname = // result is “Bill” students[0].getElementsByTagName(“firstname”)[0].textContent;
XML/Ajax Demonstration
SE2840 Dr. Mark L. Hornick
16
JSON – a lightweight alternative to XML
JSON took hold around 2005/2006
Part of the JavaScript specification, but is really a language-independent data format
SE2840 Dr. Mark L. Hornick
17
XML JSON
Scenario
Consider a Java collection of Students:List<Student> students;
where
public class Student {
String firstname;
String lastname;
int id;
String program;
}
SE2840 Dr. Mark L. Hornick
18
Here is a JSON portable collection of Students: {
“students”:
[ {
“firstname”:“Bill”,
“lastname:“Bored”,
“id”:“1111”,
“program”:“SE”
},{
“firstname”:“Bob”,
“lastname:“Sledd”,
“id”:“1114”,
“program”:“CE”
}
]
}
SE2840 Dr. Mark L. Hornick
19
Reading the data from a JSON response:{
“students”:
[ {
“firstname”:“Bill”,
“lastname:“Bored”,
“id”:“1111”,
“program”:“SE”
},{
“firstname”:“Bob”,
“lastname:“Sled”,
“id”:“1114”,
“program”:“CE”
}
]
}
SE2840 Dr. Mark L. Hornick
20
var jsonObject = JSON.parse(xhr.responseText); // responseText as above
var firstname = jsonObject.students[0].firstname; // result is “Bill”
SE2840 Dr. Mark L. Hornick
21
Can a browser display pure XML?
HTML pages consist of predefined HTML tags the meaning of these tags is well understood by a browser
<p> means a paragraph <h1> means a header
the browser knows how to display these tags by default
With XML we can define any tags we want the meaning of these tags are not automatically understood
by the browser Because of the nature of XML, there is no standard way to
display an XML document.
SE2840 Dr. Mark L. Hornick
22
CSS for XML documents
In order to display XML documents, it is necessary to have a mechanism to describe how the document should be displayed.
One of these mechanisms is Cascading Style Sheets (CSS)
