Developing Web Applications

1
Lecture 4 XML
2
Review
JavaScript

• Animation
• DOM
• Forms

3
Today

• XML
• XSLT

4
XML-

• eXtensible Markup Language
• Not actually a markup language but a way of
  defining Markup languages
• Tags are not for layout but meaning (semantics)
• A good example of XML? XHTML!

5
From HTML to XML
HTML describes the presentation
6
HTML
lth1gt Bibliography lt/h1gt ltpgt ltigt Foundations of
Databases lt/igt Abiteboul, Hull, Vianu
ltbrgt Addison Wesley, 1995 ltpgt ltigt Data on
the Web lt/igt Abiteoul, Buneman, Suciu
ltbrgt Morgan Kaufmann, 1999
7
XML
ltbibliographygt ltbookgt lttitlegt Foundations
lt/titlegt ltauthorgt Abiteboul
lt/authorgt ltauthorgt Hull
lt/authorgt ltauthorgt Vianu
lt/authorgt ltpublishergt Addison
Wesley lt/publishergt ltyeargt 1995
lt/yeargt lt/bookgt lt/bibliographygt
XML describes the content
8
XML as a central repository of data
Spreadsheet
Word processed document
Relational database
Web pages
Document in XML
9
XML is independent from the medium
PDF
Printing
HTML
XML
Web
Mobile Devices
WML
10
XML Terminology

• tags book, title, author,
• start tag ltbookgt, end tag lt/bookgt
• elements ltbookgtltbookgt,ltauthorgtlt/authorgt
• elements are nested
• empty element ltredgtlt/redgt abbrv. ltred/gt
• an XML document single root element

well formed XML document if it has matching tags
11
XML parts

• Elements define structure they may or may not
  have content.
• Attributes describe elements. An element may
  have zero, one or more attributes placed within
  the start tag. Attribute values must be enclosed
  in quotes (single or double).

12
An example of a simple XML-based markup language
ltPRODUCTgt ltPRODUCTNAMEgt CoatBluelt/PRODUCTNAMEgt ltPR
ODUCTPRICEgt 34000lt/PRODUCTPRICEgt .. lt/PRODUCTgt
Similar to HTML but contains semantic markers
13
More XML Comments

• Syntax lt!-- .... Comment text... --gt
• Yes, they are part of the data model !!!

14
More XML Attributes
ltbook price 55 currency USDgt lttitlegt
Foundations of Databases lt/titlegt ltauthorgt
Abiteboul lt/authorgt ltyeargt 1995
lt/yeargt lt/bookgt
attributes are alternative ways to represent data
15
Well Formed XML Documents

• An XML document is well formed if it is
  syntactically correct, i.e.
• There is a single root element.
• Each element has a start and an end tag.
• Elements are nested properly.
• Attribute values are in quotes.
• XML element and attribute names are case
  sensitive (unlike HTML).
• XML parser (or XML processor) is required to
  process XML documents (e.g. msxml built in
  Internet Explorer).

16
Processing XML documents (i)

• Done via parsers
• Parser can be conforming or non-conforming
• Conforming checks everything
• Non-conforming just makes rudimentary checks
• Most parsers conforming

17
Processing XML documents(ii)

• Many parsers written in Java
• Parsers can be in-memory based they build up a
  tree
• Parsers can also be event-based they trigger
  processing when some XML element is encountered

18
lt?xml version"1.0"?gt lt!DOCTYPE note
lt!ELEMENT note (to,from,heading,body)gt
lt!ELEMENT to (PCDATA)gt lt!ELEMENT from
(PCDATA)gt lt!ELEMENT heading (PCDATA)gt
lt!ELEMENT body (PCDATA)gt gt ltnotegt
lttogtTovelt/togt ltfromgtJanilt/fromgt
ltheadinggtReminderlt/headinggt ltbodygtDon't forget
me this weekendlt/bodygt lt/notegt
DTD Example
19
DTD - attributes
lt!ELEMENT TOWN (COUNTY, POPULATION)gt ltATTLIST
TOWN NAME CDATA REQUIREDgt
The element TOWN has an attribute NAME which
contains char data and is always required
20
XML Schema the successor to DTDs

• An XML schema fulfils the same criteria as the
  DTD -- it defines what is legal in an XML
  document
• A parser or some other processing tool can then
  use it as a guide
• If data is being exchanged between systems the
  schema can be used as a guide to the receiver to
  understand what is expected
• Not only a syntactical check but semantic too

21
Schema example
lt?xml version"1.0"?gt ltxsschema
xmlnsxs"http//www.w3.org/2001/XMLSchema" target
Namespace"http//www.w3schools.com" xmlns"http/
/www.w3schools.com" elementFormDefault"qualified"
gtltxselement name"note"gt ltxscomplexTypegt
ltxssequencegt ltxselement name"to"
type"xsstring"/gt ltxselement name"from"
type"xsstring"/gt ltxselement name"heading"
type"xsstring"/gt ltxselement name"body"
type"xsstring"/gt lt/xssequencegt
lt/xscomplexTypegt lt/xselementgtlt/xsschemagt
22
XSL/T
23
What is XSL?

• Stylesheets are typically used to specify how
  something should be displayed/rendered.
• They lead to separation of document's content
  from presentational information.
• The Extensible Stylesheet Language (XSL) includes
  two independent parts a transformation language
  (XSLT) and formatting objects language (XSLFO).
• XSL defines rules for how one XML document is
  transformed into another XML document

24
XSLT Processor
XML Document
XSLT Stylesheet
.xml
.xsl
XML Document
.xml
XSLT Processor
25
XSLT Processor
XML Document
XSLT Stylesheet
.xml
.xsl
HTML Document
.html
XSLT Processor
26
XSLT Processor
XML Document
XSLT Stylesheet
.xml
.xsl
Text File (eventually containing formatting
information)
.tex .rtf
XSLT Processor
27
XSLT Stylesheet (1)XML document
lt?xml version"1.0"?gt lt?xml-stylesheet
type"text/xml" href"picturegallery.xsl"?gt ltPictu
reSetgt lttitlegtPictures from My Holidaylt/titlegt
ltpicturegt ltsource location"town.jpg"
width"750" height"509"/gt
ltdescriptiongtSeaside townlt/descriptiongt
lt/picturegt ltpicturegt ltsource
location"port.jpg" width"878" height"544"/gt
ltthumbnail location"port_t.jpg"/gt
ltdescriptiongtSea portlt/descriptiongt
lt/picturegt lt/PictureSetgt
28
XSLT Stylesheet (2)XML Document's Tree
29
XSLT Stylesheet (3)
XSL Transformation
An XML/HTML document
Original XML document

• XSLT processor models an XML document as a tree
  that contains seven kind of nodes the root,
  element, text, attribute, namespace, processing
  instruction, comment.
• XSLT operates by transforming one XML tree into
  another XML tree by employing operators for
  selecting nodes from the tree, reordering the
  nodes, and outputting nodes.

30
XSLT Stylesheet (4)The Stylesheet
picturegallery.xsl
lt?xml version"1.0"?gt ltxslstylesheet
version"1.0" xmlnsxsl"http//www.w3.org/
1999/XSL/Transform"gt ltxsltemplate
matchpicture"gt lthtmlgt ltbodygt
ltxslvalue-of selectdescription"/gt
lt/bodygt lt/htmlgt lt/xsltemplategt lt/xslstyleshee
tgt
31
Result of Applying picturegallery.xsl to the
example XML Document
Seaside town Sea port
32
Template Rules

• An XSLT processor transforms an XML document
  starting from the root of the document tree.
• At each turn, a node from the document tree is
  compared to the template rules.
• When the XSLT processor finds a template rule
  such that the current node matches its pattern
  then the XSLT processor outputs the template
  rules substitution part to the result document.
• If the substitution part contains
  ltxslapply-templates/gt then at that point the
  child (element and text) nodes of the current
  node are processed one by one. This is a
  recursive process.

33
Template Rules
General structure of an XSLT rule
ltxsltemplate match"XPath pattern"gt
Substitution part lt/xsltemplategt

• The XPath expression specifies a pattern to be
  matched by a node in the document's tree.
• The substitution part specifies what should be
  inserted instead of the matched pattern
• XSL elements, markup and text

34
Default Template Rules
Default Rule
ltxsltemplate match"/ "gt
ltxslapply-templates/gt lt/xsltemplategt

• Matches the document trees root node (/) and any
  element node () and applies template to their
  child nodes.

35
What we did

• Introduction to XML
• Basic XML language
• Structure
• Parsing
• Introduction to XSL/T
• Simple transformations

What you should do

• W3Schools tutorials XML XSL/T
• Experiment

36
Whats next
Server-side Languages An Overview