html, css, and xml tutorial 11 creating xml document
Post on 22-Dec-2015
265 Views
Preview:
TRANSCRIPT
HTML, CSS, and XML
Tutorial 11Creating XML Document
XPXPXPXPObjectives• Describe the history of XML and the uses of XML
documents• Understand XML vocabularies• Define well-formed and valid XML documents,
and describe the basic structure of an XML document
• Create an XML declaration• Work with XML comments• Work with XML parsers and understand how Web
browsers work with XML documentsNew Perspectives on HTML, CSS, and XML 4th edition 2
XPXPXPXPObjectives (continue)• Create XML elements and attributes• Work with character and entity references• Describe how XML handles parsed character data,
character data, and white space• Create an XML processing instruction to apply a
style sheet to an XML document• Declare a default namespace for an XML
vocabulary and apply the namespaceAccess desktop icons and gadgets on the desktop
New Perspectives on HTML, CSS, and XML 4th edition 3
XPXPXPXPIntroducing XML• XML stands for Extensible Markup Language.– It is markup language that can be extended
and modified to match the needs of the document author and data being recorded.
– XML has some advantages in presenting structured content.
– Because it is extensible, XML can be used to create a wide variety of document types.
New Perspectives on HTML, CSS, and XML 4th edition 4
XPXPXPXPIntroducing XML• XML has its roots in Standard Generalized
Markup Language (SGML) which was introduced in the 1980s.
• SGML is device-independent and system-independent.
• SGML is difficult to learn and to apply because of its power, scope, and flexibility.
• XML is a language used to create vocabularies for other markup languages but does not have SGML complexity.
New Perspectives on HTML, CSS, and XML 4th edition 5
XPXPXPXPXML Syntax Rules
New Perspectives on HTML, CSS, and XML 4th edition 6
XPXPXPXPXML Today• XML was originally created to structure, store,
and transport information.• XML has become the most common tool for
data transmission among various applications.• XML is used across a variety of industries.• XML is used in all major Web sites.• Many software applications (Excel and Word),
and server languages (Java, .NET, Perl, PHP) can read and create XML files.
New Perspectives on HTML, CSS, and XML 4th edition 7
XPXPXPXPXML Today (continue)• All major databases can read and create XML
files.• On Web pages the structure of XML closely
matches the structure used to display the same information in HTML.
• Mobile device platforms (Google’s Android and Apple’s iOS use XML in a variety of ways.
New Perspectives on HTML, CSS, and XML 4th edition 8
XPXPXPXPXML Vocabularies
New Perspectives on HTML, CSS, and XML 4th edition 9
XPXPXPXPWell-Formed and Valid XML Documents• An XML document is well-formed if it contains
no syntax errors and satisfies the general specifications for XML code as laid out by the W3C.
• A well-formed XML document that satisfies the rules of a DTD or schema is said to be a valid document.
New Perspectives on HTML, CSS, and XML 4th edition 10
XPXPXPXPThe Structure of an XML Document• XML documents consist of three parts– The prolog– The document body– The epilog
• The prolog is optional and provides information about the document itself– XML declaration– Processing instructions– Comments lines– Document type declaration (DTD)
New Perspectives on HTML, CSS, and XML 4th edition 11
XPXPXPXPThe Structure of an XML Document
New Perspectives on HTML, CSS, and XML 4th edition 12
XPXPXPXPThe Structure of an XML Document• The document body contains the document’s
content in a hierarchical tree structure.
• The epilog is also optional and contains any final comments or processing instructions.
New Perspectives on HTML, CSS, and XML 4th edition 13
XPXPXPXPThe XML Declaration• The XML declaration is always the first part of the
prolog in an XML document. It signals to the program reading the file that the document is written in XML, and it provides information about how that code is to be interpreted by the program.
• The syntax is:<?xml version=“version number”encoding=“encoding type” standalone=“yes | no” ?>
• A sample declaration:<?xml version=“1.0” encoding=“UTF-8” standalone=“yes” ?>
New Perspectives on HTML, CSS, and XML 4th edition 14
XPXPXPXPInserting Comments• Comments can appear anywhere in the prolog go
after the XML declaration. • Comments provide additional information about
what the document will be used for and how it was created.
• The syntax for comments is <!-- comment -->• This is the same syntax for HTML comments
<!-- This document contains data on SJB Pet Butique holiday specials File name: sjbpet.xml Author: Patricia Dean Date: 9/18/2016 -->
New Perspectives on HTML, CSS, and XML 4th edition 15
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 16
XML Parsers• Parser (or processor) is a program that reads
and interprets an XML document.• Parser interprets a document’s code and
verifies that it satisfies all the XML specifications for document structure and syntax.
• Parsers are strict.• All major Web browsers include an XML
parser.
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 17
XML Parsing Process
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 18
Exchanger XML Editor
XPXPXPXPWorking with Elements• Elements are the basic building blocks of XML.• An element can have text content and child
element content.• The content is stored between an opening tag
and a closing tag, just as in HTML.• The syntax of an XML element with text:
<element>content</element>• Example:
<manufacturer>SJB Pet Boutique</manufacturer>
New Perspectives on HTML, CSS, and XML 4th edition 19
XPXPXPXPWorking with Elements• Element names are case sensitive.• Element names must begin with a letter or the
underscore and cannot contain blank spaces.• The element’s name in closing tag must exactly
match the name in the opening tag.• An empty element with a single tag:
<element />• An empty element with a pair of tags:
<element></element>
New Perspectives on HTML, CSS, and XML 4th edition 20
XPXPXPXPNesting Elements• An element contained within another element.• Nested elements also called child elements.• Child elements must be enclosed within their
parent elements.• Example:
<product><productName>Dog Shirt Gift Basket</productName>
<manufacturer>SJB Pet Boutique</manufacturer><description>Something for every day of the week</description><price>35.99</price><productItems>1200, 1201, 1202, 1203, 1204 </productItems>
</product>
New Perspectives on HTML, CSS, and XML 4th edition 21
XPXPXPXPThe Element Hierarchy• All elements in the body are children of a
single element called the root or document element.
• There can be only one root element.• The familial relationship of parent, child, and
sibling extends throughout the entire document body.
New Perspectives on HTML, CSS, and XML 4th edition 22
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 23
The Element Hierarchy
XPXPXPXPCharting the Element Hierarchy
New Perspectives on HTML, CSS, and XML 4th edition 24
XPXPXPXPWriting the Document Body
New Perspectives on HTML, CSS, and XML 4th edition 25
XPXPXPXPWorking with Attributes• An attribute is a feature or characteristic of an
element. • Every element can contain one or more
attributes.• Attributes are text strings and must be placed
in single or double quotes. The syntax is: <element attribute=“value”> … </element>
or<element attribute=“value” />
New Perspectives on HTML, CSS, and XML 4th edition 26
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 27
Working with Attributes
XPXPXPXPUsing Character and Entity References
• Special characters, such as the € symbol, can be inserted into your XML document by using a character reference. The syntax is:&#nnn;
• Some symbols also can be identified using entity reference. The syntax is:&#entity;
New Perspectives on HTML, CSS, and XML 4th edition 28
XPXPXPXPUsing Character and Entity References
• nnn is a character reference number or name from the ISO/IEC character set.
• entity is the name assigned to the symbol.• ISO/IEC character set is an international
numbering system for referencing characters from virtually any language.
• Character references in XML are the same as in HTML.
New Perspectives on HTML, CSS, and XML 4th edition 29
XPXPXPXPUsing Character and Entity References
New Perspectives on HTML, CSS, and XML 4th edition 30
XPXPXPXPUsing Character and Entity References
New Perspectives on HTML, CSS, and XML 4th edition 31
XPXPXPXPParsed Character Data• Parsed character data (PCDATA) consists of all
those characters that XML treats as parts of the code of XML document– The XML declaration– The opening and closing tags of an element– Empty element tags– Character or entity references– Comments
New Perspectives on HTML, CSS, and XML 4th edition 32
XPXPXPXPCharacter Data and White Space• Character data is not processed, but instead is
treated as pure data content.• White space refers to nonprintable characters
such as spaces (created by pressing the Spacebar), new line characters (created by pressing the Enter key), or tab characters (created by pressing the Tab key).
• HTML applies white space stripping, in which consecutive occurrences of white space are treated as a single space.
New Perspectives on HTML, CSS, and XML 4th edition 33
XPXPXPXPCreating a CDATA Section• A CDATA section is a block of text that XML
treats as character data only.• The syntax to create a CDATA section is:
<! [CDATA [character data
] ]>• A CDATA section may contain most markup
characters, such as <, >, and &.
New Perspectives on HTML, CSS, and XML 4th edition 34
XPXPXPXPCreating CDATA Section• This example shows an element named
htmlcode that contains a CDATA section, which is used to store several HTML tags:<htmlcode>
<![CDATA[<h1>SJB Pet Boutique</h1>
<h2>Fashion for Pets and Their Humans</h2>]]>
</htmlcode>
New Perspectives on HTML, CSS, and XML 4th edition 35
XPXPXPXPExample of CDATA Section
New Perspectives on HTML, CSS, and XML 4th edition 36
XPXPXPXPFormatting XML Data with CSS• XML documents do not include any
information about how they should be rendered. Rendering is determined solely by the parser.
• Link the XML document to a style sheet to format the document. The XML parser will combine the style sheet with the XML document and will render a single formatted document.
New Perspectives on HTML, CSS, and XML 4th edition 37
XPXPXPXPFormatting XML Data with CSS
New Perspectives on HTML, CSS, and XML 4th edition 38
XPXPXPXPApplying a Style to an Element• Cascading Style Sheets (CSS) – style sheet
language.• To apply a style sheet to a document, use the
following style declaration: selector {
attribute1: value1; attribute2: value2; …
}• selector is an element (or set of elements,
separated by comma) from the XML document.• attribute and value are the style attributes and
attribute values to be applied to the document.
New Perspectives on HTML, CSS, and XML 4th edition 39
XPXPXPXPApplying a Style to an Element• For example:
author { color: red; font-weight: bold;}
• Will display the text of the artist element in a red boldface type.
New Perspectives on HTML, CSS, and XML 4th edition 40
XPXPXPXPInserting a Processing Instruction• The link from the XML document to a style sheet
is created using a processing instruction.• A processing instruction is a command that tells
an XML parser how to process the document. • Processing instruction syntax:
<?target instruction ?>target identifies the program (or object) to which the processing instruction is directed and instruction is information that the document passes on to the parser for processing<?xml-stylesheet type=”text/css” href=”url” media=”type” ?>
New Perspectives on HTML, CSS, and XML 4th edition 41
XPXPXPXPThe sjbpet.xml Document with Style Sheet Applied
New Perspectives on HTML, CSS, and XML 4th edition 42
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 43
Working with Namespaces• Namespace – a defined collection of element
and attribute names.• Applying a namespace to an XML document
involves two steps:1. Declare the namespace.2. Identify the elements and attributes within the
document that belong to that namespace.
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 44
Declaring a Namespace• Syntax:
<element xmlns:prefix=”uri”> ... </element>– element is the element in which the namespace is
declared, prefix is a string of characters that you’ll add to element and attribute names to associate them with the declared namespace, and uri is a Uniform Resource Identifier (URI)—a text string that uniquely identifies a resource.
• Example:<products xmlns:prd=”http://example.com/sjbpetboutique/products”> ...
</products>
XPXPXPXP
New Perspectives on HTML, CSS, and XML 4th edition 45
Applying a Default Namespace• A default namespace is declared omitting the
prefix in the namespace declaration.• Syntax:
<element xmlns=”uri”> ... </element>
• Example:<products xmlns=”http://example.com/sjbpetboutique/products”>
top related