Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
Scribd
Upload
39 views

Css XML DTD

Uploaded by

kartikd1805
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
39 views

Css XML DTD

Uploaded by

kartikd1805
Copyright
© © All Rights Reserved
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 23

CSS (Cascading Style Sheets)

CSS is an acronym stands for Cascading Style Sheets. It is a style sheet language which is used to
describe the look and formatting of a document written in markup language. It provides an additional
feature to HTML. It is generally used with HTML to change the style of web pages and user
interfaces. It can also be used with any kind of XML documents including plain XML.

CSS is used along with HTML and JavaScript in most websites to create user interfaces for web
applications and user interfaces for many mobile applications.

What does CSS do:


o We can add new looks to our old HTML documents.
o We can completely change the look of our website with only a few changes in CSS code.

Why use CSS:


These are the three major benefits of CSS:

1) Solves a big problem:


Before CSS, tags like font, color, background style, element alignments, border and size had to be
repeated on every web page. This was a very long process. For example: If we are developing a large
website where fonts and color information are added on every single page, it will be become a long
and expensive process. CSS was created to solve this problem. It was a W3C recommendation.
2) Saves a lot of time
CSS style definitions are saved in external CSS files so it is possible to change the entire website by
changing just one file.
3) Provide more attributes
CSS provides more detailed attributes than plain HTML to define the look and feel of the website.

CSS Syntax:
A CSS rule set contains a selector and a declaration block.

Selector: Selector indicates the HTML element we want to style. It could be any tag like <h1>,
<title> etc.
Declaration Block: The declaration block can contain one or more declarations separated by a
semicolon. For the above example, there are two declarations:
1. color: yellow;
2. font-size: 11 px;
Each declaration contains a property name and value, separated by a colon.
Property: A Property is a type of attribute of HTML element. It could be color, border etc.
Value: Values are assigned to CSS properties. In the above example, value "yellow" is assigned to
color property.

1
Genrel Syntax:
Selector{Property1: value1; Property2: value2; ..........;}

CSS Selectors

CSS selectors are used to select the content we want to style. Selectors are the part of CSS rule set.
CSS selectors select HTML elements according to its id, class, type, attribute etc.

There are several different types of selectors in CSS.

1. CSS Element Selector


2. CSS Id Selector
3. CSS Class Selector
4. CSS Universal Selector
5. CSS Group Selector

1) CSS Element Selector:


The element selector selects the HTML element by name.
Here we have taken element <p> and set the style as text-align to center and color to blue.

<!DOCTYPE html>
<html>
<head>
<style>
p{
text-align: center;
color: blue;
}
</style>
</head>
<body>
<p>This style will be applied on every paragraph.</p>
<p id="para1">Me too!</p>
<p>And me!</p>
</body>
</html>

2) CSS Id Selector:

The id selector selects the id attribute of an HTML element to select a specific element. An id is
always unique within the page so it is chosen to select a single, unique element.
It is written with the hash character (#), followed by the id of the element.
Let?s take an example with the id "para1".

<!DOCTYPE html>
<html>
<head>
<style>
#para1 {
text-align: center;
color: blue;
}

2
</style>
</head>
<body>
<p id="para1">Hello Javatpoint.com</p>
<p>This paragraph will not be affected.</p>
</body>
</html>

3) CSS Class Selector


The class selector selects HTML elements with a specific class attribute. It is used with a period
character . (full stop symbol) followed by the class name.

<!DOCTYPE html>
<html>
<head>
<style>
.center {
text-align: center;
color: blue;
}
</style>
</head>
<body>
<h1 class="center">This heading is blue and center-aligned.</h1>
<p class="center">This paragraph is blue and center-aligned.</p>
</body>
</html>
CSS Class Selector for specific element
If we want to specify that only one specific HTML element should be affected then you should use
the element name with class selector.
<!DOCTYPE html>
<html>
<head>
<style>
p.center {
text-align: center;
color: blue;
}
</style>
</head>
<body>
<h1 class="center">This heading is not affected</h1>
<p class="center">This paragraph is blue and center-aligned.</p>
</body>
</html>
4) CSS Universal Selector
The universal selector is used as a wildcard character. It selects all the elements on the pages.

<!DOCTYPE html>
<html>
<head>
<style>
*{
color: green;
3
font-size: 20px;
}
</style>
</head>
<body>
<h2>This is heading</h2>
<p>This style will be applied on every paragraph.</p>
<p id="para1">Me too!</p>
<p>And me!</p>
</body>
</html>

5) CSS Group Selector


The grouping selector is used to select all the elements with the same style definitions.
Grouping selector is used to minimize the code. Commas are used to separate each selector in
grouping.
Let's see the CSS code without group selector.
h1 {
text-align: center;
color: blue;
}
h2 {
text-align: center;
color: blue;
}
p{
text-align: center;
color: blue;
}

As we can see, we need to define CSS properties for all the elements. It can be grouped in following
ways:

h1,h2,p {
text-align: center;
color: blue;
}

<!DOCTYPE html>
<html>
<head>
<style>
h1, h2, p {
text-align: center;
color: blue;
}
</style>
</head>
<body>
<h1>Hello Javatpoint.com</h1>
<h2>Hello Javatpoint.com (In smaller font)</h2>
<p>This is a paragraph.</p>
</body>
</html>
4
How to add CSS:

CSS is added to HTML pages to format the document according to information in the style sheet.

There are three ways to insert CSS in HTML documents.


1. Inline CSS
2. Internal CSS
3. External CSS

(1) Inline CSS:


Inline CSS is used to apply CSS on a single line or element or tags. We can apply CSS in a single
element by inline CSS technique.
General syntax: <html Tag style = “property:value”>
For example: <p style=”font-family: Arial; color: red">Hello CSS</p>
Here with the tag p two properties are used such as font-family and color and these are associated
with the values such as Arial and red respectively.
Disadvantages of Inline CSS
o We cannot use quotations within inline CSS. If we use quotations the browser will interpret
this as an end of our style value.
o These styles cannot be reused anywhere else.
o These styles are tough to be edited because they are not stored at a single place.
o It is not possible to style pseudo-codes and pseudo-classes with inline CSS.
o Inline CSS does not provide browser cache advantages.

2) Internal CSS:
Internal CSS is used to apply CSS on a single document or page. It can affect all the elements of the
page. It is written inside the style tag within head section of html. The important point while using
the Internal CSS is that we should mention the style type = “text/css” in the head section by this the
browse come to know that the program is making use of cascading style sheet.
For example:
<style type= “text/css”>
p{color:blue}
</style>

<!DOCTYPE html>
<html>
<head>
<style type=”text/css”>
body {
background-color: linen;
}
h1 {
color: red;
margin-left: 80px;
}
</style>
</head>
<body>
<h1>The internal style sheet is applied on this heading.</h1>
<p>This paragraph will not be affected.</p>
</body>
</html>

5
3) External CSS:
External CSS is used to apply CSS on multiple pages or all pages. The external style sheet is
generally used when we want to make changes on multiple pages. It is ideal for this condition
because it facilitates us to change the look of the entire web site by changing just one file.

It uses the <link> tag on every pages and the <link> tag should be put inside the head section.

Here, we write all the CSS code in a css file. Its extension must be .css for example style.css.
For example:
We need to link this style.css file to our html pages like this:
<link rel="stylesheet" type="text/css" href="style.css">
When we want to link an external style sheet then we have to use <link> tag which os to be written
in the head section. The following parameter need to be mention.
 link: tells the browser some file must be linked to the page
 rel = stylesheet: : tells the browser that this linked file is a stylesheet.
 href=” ”: denoted the path name of the stylesheet file.
 Type=”text/css” : by this the browse come to know that the program is making use of
cascading style sheet.
<head>
<link rel="stylesheet" type="text/css" href="mystyle.css">
</head>

The external style sheet may be written in any text editor but must be saved with a .css extension.
This file should not contain HTML elements.
mystyle.css
body {
background-color: lightblue;
}
h1 {
color: navy;
margin-left: 20px;
}

CSS Comments:

CSS comments are generally written to explain our code. It is very helpful for the users who reads
our code so that they can easily understand the code.
Comments are ignored by browsers.
Comments are single or multiple lines statement and written within /*............*/ .
<!DOCTYPE html>
<html>
<head>
<style>
p{
color: blue;
/* This is a single-line comment */
text-align: center;
}
/* This is
a multi-line
comment */
</style>
</head>
<body>
6
<p>Hello Javatpoint.com</p>
<p>This statement is styled with CSS.</p>
<p>CSS comments are ignored by the browsers and not shown in the output.</p>
</body>
</html>

CSS Background:

CSS background property is used to define the background effects on element. There are 5 CSS
background properties that affects the HTML elements:
1. background-color
2. background-image
3. background-repeat
4. background-attachment
5. background-position

1) CSS background-color:
The background-color property is used to specify the background color of the element.
We can set the background color like this:
<style>
h2, p{
background-color: #b0d4de;
}
</style>

2) CSS background-image
The background-image property is used to set an image as a background of an element. By default
the image covers the entire element. We can set the background image for a page like this.

<style>
body {
background-image: url("paper1.gif");
margin-left:100px;
}
</style>

3) CSS background-repeat:

By default, the background-image property repeats the background image horizontally and vertically.
Some images are repeated only horizontally or vertically.
The background looks better if the image repeated horizontally only.
1. background-repeat: repeat-x;
<style>
body {
background-image: url("gradient_bg.png");
background-repeat: repeat-x;
}
</style>

background-repeat: repeat-y;
<style>
7
body {
background-image: url("gradient_bg.png");
background-repeat: repeat-y;
}
</style>

4) CSS background-attachment:
The background-attachment property is used to specify if the background image is fixed or scroll
with the rest of the page in browser window. If we set fixed the background image then the image
will not move during scrolling in the browse
1. background: white url('bbb.gif');
2. background-repeat: no-repeat;
3. background-attachment: fixed;

5) CSS background-position
The background-position property is used to define the initial position of the background image. By
default, the background image is placed on the top-left of the webpage.
We can set the following positions:
1. center
2. top
3. bottom
4. left
5. right
background: white url('good-morning.jpg');
background-repeat: no-repeat;
background-attachment: fixed;
background-position: center;

CSS Border:

The CSS border is a shorthand property used to set the border on an element.
The CSS border properties are use to specify the style, color and size of the border of an element.
The CSS border properties are given below
o border-style
o border-color
o border-width
o border-radius

(1) CSS border-style:


The Border style property is used to specify the border type which we want to display on the web
page.
There are some border style values which are used with border-style property to define a border.
Value Description

none It doesn't define any border.

dotted It is used to define a dotted border.

dashed It is used to define a dashed border.


8
solid It is used to define a solid border.

double It defines two borders wIth the same border-width value.

groove It defines a 3d grooved border. effect is generated according to border-color


value.

ridge It defines a 3d ridged border. effect is generated according to border-color value.

inset It defines a 3d inset border. effect is generated according to border-color value.

outset It defines a 3d outset border. effect is generated according to border-color value.

<style>
p.none {border-style: none;}
p.dotted {border-style: dotted;}
p.dashed {border-style: dashed;}
p.solid {border-style: solid;}
p.double {border-style: double;}
p.groove {border-style: groove;}
p.ridge {border-style: ridge;}
p.inset {border-style: inset;}
p.outset {border-style: outset;}
p.hidden {border-style: hidden;}
</style>

2) CSS border-width:

The border-width property is used to set the border's width. It is set in pixels. We can also use the
one of the three pre-defined values, thin, medium or thick to set the width of the border.
Note: The border-width property is not used alone. It is always used with other border
properties like "border-style" property to set the border first otherwise it will not work.
<style>
p.one {
border-style: solid;
border-width: 5px;
}
p.two {
border-style: solid;
border-width: medium;
}
p.three {
border-style: solid;
border-width: 1px;
}
</style>
3) CSS border-color:
There are three methods to set the color of the border.
o Name: It specifies the color name. For example: "red".
o RGB: It specifies the RGB value of the color. For example: "rgb(255,0,0)".
o Hex: It specifies the hex value of the color. For example: "#ff0000".
There is also a border color named "transparent". If the border color is not set it is inherited from the
color property of the element.

9
Note: The border-color property is not used alone. It is always used with other border
properties like "border-style" property to set the border first otherwise it will not work.
<style>
p.one {
border-style: solid;
border-color: red;
}
p.two {
border-style: solid;
border-color: #98bf21;
}
</style>
</style>

CSS Font

CSS Font property is used to control the look of texts. By the use of CSS font property we can
change the text size, color, style and more. These are some important font attributes:

1. CSS Font color(font-color) This property is used to change the color of the text. (standalone
attribute) , values may be name of the color or the hexadecimal value of color.
2. CSS Font family (font-family) This property is used to change the face of the font. It
specifies the font family name like Arial, New Times Roman etc.
3. CSS Font size (font-size)This property is used to increase or decrease the size of the font.
The possible values that can be used with it.
Font Size Value Description

xx-small used to display the extremely small text size.

x-small used to display the extra small text size.

small used to display small text size.

medium used to display medium text size.

large used to display large text size.

x-large used to display extra large text size.

xx-large used to display extremely large text size.

smaller used to display comparatively smaller text size.

larger used to display comparatively larger text size.

size in pixels or % used to set value in percentage or in pixels.

4. CSS Font style (font-size) This property is used to make the font bold, italic or oblique.
5. CSS Font variant (font-varient) This property creates a small-caps effect.
6. CSS Font weight (font-weight) This property is used to increase or decrease the boldness
and lightness of the font. The possible values of font weight may be normal, bold, bolder,
lighter or number (100, 200..... upto 900).

10
CSS Margin

CSS Margin property is used to define the space around elements. It is completely transparent and
doesn't have any background color. It clears an area around the element.
Top, bottom, left and right margin can be changed independently using separate properties. We can
also change all properties at once by using shorthand margin property.
There are following CSS margin properties:
CSS Margin Properties
Property Description

margin This property is used to set all the properties in one declaration.

margin-left it is used to set left margin of an element.

margin-right It is used to set right margin of an element.

margin-top It is used to set top margin of an element.

margin-bottom It is used to set bottom margin of an element.

CSS Margin Values:


These are some possible values for margin property.
Value Description

auto This is used to let the browser calculate a margin.

length It is used to specify a margin pt, px, cm, etc. its default value is 0px.

% It is used to define a margin in percent of the width of containing element.

inherit It is used to inherit margin from parent element.

11
XML (eXtensible Markup Language)

o Xml (eXtensible Markup Language)


o Extensible Markup Language (XML) is used to describe data.
o XML is designed to store and transport data.
o Xml was released in late 90’s. It was created to provide an easy to use and store self
describing data.
o XML became a W3C Recommendation on February 10, 1998.
o XML is not a replacement for HTML.
o XML is designed to be self-descriptive.
o XML is designed to carry data, not to display data.
o XML tags are not predefined. We must define our own tags.
o XML is platform independent and language independent.

XML BASICS :
XML, or eXtensible markup language, is all about creating a universal way for both formatting and
presenting data. Once data is coded or marked up with XML tags, data can then be used in many
different ways.

Main features of XML:

 XML files are text files, which can be managed by any text editor.
 XML is very simple, because it has less than 10 syntax rules.

Because of these features, XML offers following advantages

 XML provides a basic syntax that can be used to share information between different kinds of
computers, different applications, and different organizations. XML data is stored in plain
text format.
 With XML, our data can be available to all kinds of "reading machines" (Handheld
computers, voice machines, news feeds, etc), and make it more available for blind people, or
people with other disabilities.
 Databases can trade tables, business applications can trade updates, and document systems
can share information.
 It supports Unicode, allowing almost any information in any written human language to be
communicated.
 Its self-documenting format describes structure and field names as well as specific values.
 Content-based XML markup enhances searchability, making it possible for agents and search
engines to categorize data instead of wasting processing power on context-based full-text
searches.
 XML is heavily used as a format for document storage and processing, both online and
offline.
 It is based on international standards.
 It is platform-independent, thus relatively immune to changes in technology.
 Forward and backward compatibility are relatively easy to maintain despite changes in DTD or
Schema.

How can XML be used?


 XML can keep data separated from HTML
 XML can be used to store data inside HTML documents
 XML can be used as a format to exchange information
 XML can be used to store data in files or in databases

12
Why xml?
Platform Independent and Language Independent:
The main benefit of xml is that we can use it to take data from a program like Microsoft SQL,
convert it into XML then share that XML with other programs and platforms. We can communicate
between two platforms which are generally very difficult.

The main thing which makes XML truly powerful is its international acceptance. Many corporation
use XML interfaces for databases, programming, office application mobile phones and more. It is
due to its platform independent feature.

XML Example:
XML documents create a hierarchical structure looks like a tree so it is known as XML Tree that
starts at "the root" and branches to "the leaves".

Example of XML Document


XML documents uses a self-describing and simple syntax:

<?xml version="1.0" encoding="ISO-8859-1"?>


<note>
<to>cam</to>
<from>Jam</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>
The first line is the XML declaration. It defines the XML version (1.0) and the encoding used (ISO
8859-1 = Latin-1/West European character set).
The next line describes the root element of the document (like saying: "this document is a note"):
1. <note>
The next 4 lines describe 4 child elements of the root (to, from, heading, and body).
2. <to>Tove</to>
3. <from>Jani</from>
4. <heading>Reminder</heading>
5. <body>Don't forget me this weekend!</body>
And finally the last line defines the end of the root element.
6. </note>

XML documents must contain a root element. This element is "the parent" of all other elements.
The elements in an XML document form a document tree. The tree starts at the root and branches to
the lowest level of the tree.
All elements can have sub elements (child elements).

<root>
<child>
<subchild>.....</subchild>
</child>
</root>

13
The main difference between XML and HTML:
HTML is an abbreviation for HyperText Markup Language while XML stands for eXtensible
Markup Language.The differences are as follows:-
1. HTML was designed to display data with focus on how data looks while XML was
designed to be a software and hardware independent tool used to transport and store data,
with focus on what data is.
2. HTML is a markup language itself while XML provides a framework for defining
markup languages.
3. HTML is a presentation language while XML is neither a programming language nor a
presentation language.
4. HTML is case insensitive while XML is case sensitive.
5. HTML is used for designing a web-page to be rendered on the client side while XML is
used basically to transport data between the application and the database.
6. HTML has its own predefined tags while what makes XML flexible is that custom tags can
be defined and the tags are invented by the author of the XML document.
7. HTML is not strict if the user does not use the closing tags but XML makes it mandatory
for the user the close each tag that has been used.
8. HTML does not preserve white space while XML does.
9. HTML is about displaying data, hence static but XML is about carrying information, hence
dynamic.
Thus,it can be said that HTML and XML are not competitors but rather complement to each
other and clearly serving altogether different purposes.

The building blocks of XML documents

XML documents (and HTML documents) are made up by the following building blocks:-
Elements, Tags, Attributes, Entities, PCDATA, and CDATA
This is a brief explanation of each of the building blocks:
Elements
Elements are the main building blocks of both XML and HTML documents. Examples of HTML
elements are "body" and "table".
Examples of XML elements could be "note" and "message". Elements can contain text, other
elements, or be empty. Examples of empty HTML elements are "hr", "br" and "img".
In a DTD, elements are declared with an ELEMENT declaration.
Tags
Tags are used to markup elements.
A starting tag like <element_name> mark up the beginning of an element, and an ending tag like
</element_name> mark up the end of an element.
Examples: A body element: <body>body text in between</body>. A message element:
<message>some message in between</message>
Attributes
Attributes provide extra information about elements.
Attributes are placed inside the start tag of an element. Attributes come in name/value pairs. The
following "img" element has an additional information about a source file:
<img src="computer.gif" />
The name of the element is "img". The name of the attribute is "src". The value of the attribute is
"computer.gif". Since the element itself is empty it is closed by a " /".
PCDATA
PCDATA stands for Parsed Character data. PCDATA is the text that will be parsed by a parser.
Tags inside the PCDATA will be treated as markup and entities will be expanded.

14
CDATA
CDATA: (Unparsed Character data): CDATA contains the text which is not parsed further in an
XML document. Tags inside the CDATA text are not treated as markup and entities will not be
expanded.
Entities
Entities as variables used to define common text. Entity references are references to entities.
Most of you will known the HTML entity reference: "&nbsp;" that is used to insert an extra
space in an HTML document. Entities are expanded when a document is parsed by an XML
parser.
The following entities are predefined in XML:

Entity Character
References
&lt; <
&gt; >
&amp; &
&quot; "
&apos; '

Wrapping:
If the DTD is to be included in your XML source file, it should be wrapped in a DOCTYPE
definition with the following syntax:
<!DOCTYPE root-element [element-declarations]>
example:
<?xml version="1.0"?>
<!DOCTYPE note [
<!ELEMENT note (to,from,heading,body)>
<!ELEMENT to (#CDATA)>
<!ELEMENT from (#CDATA)>
<!ELEMENT heading (#CDATA)>
<!ELEMENT body (#CDATA)>
]>
<note>
<to>cam</to>
<from>Jam</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend</body>
</note>

Types of XML Documents:


There are two kinds of XML documents:
1. Well-formed
2. Valid

1. Well-formed
A "Well Formed" XML document is a document that conforms to the XML syntax rules. They
contain text and XML tags. Everything is entered correctly. They do not, however, refer to a DTD.
The following is a "Well Formed" XML document:

<?xml version="1.0"?>
<note>
<to>cam</to>
<from>Jam</from>
15
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>

2. Valid
Valid documents not only conform to XML syntax but they also are error checked against a
Document Type Definition (DTD) or schema
The following is the same document as above but with an added reference to a DTD:
<?xml version="1.0"?>
<!DOCTYPE note SYSTEM "InternalNote.dtd">
<note>
<to>cam</to>
<from>Jam</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>

XML DTD

DTD stands for Document Type Definition. It defines the legal building blocks of an XML
document. It is used to define document structure with a list of legal elements and attributes.

Purpose of DTD:
Its main purpose is to define the structure of an XML document. It contains a list of legal elements
and defines the structure with the help of them.

Checking Validation:
Before proceeding with XML DTD, we must check the validation. An XML document is called
"well-formed" if it contains the correct syntax.
A well-formed and valid XML document is one which have been validated against DTD.

Valid and well-formed XML document with DTD:

employee.xml
<?xml version="1.0"?>
<!DOCTYPE employee SYSTEM "employee.dtd">
<employee>
<firstname>vimal</firstname>
<lastname>kumar</lastname>
<email>vimal@xyz.com</email>
</employee>
In this a example, the DOCTYPE declaration refers to an external DTD file. The content of the file is
shown in below paragraph
employee.dtd
<!ELEMENT employee (firstname,lastname,email)>
<!ELEMENT firstname (#PCDATA)>
<!ELEMENT lastname (#PCDATA)>
<!ELEMENT email (#PCDATA)>

Description of DTD:
<!DOCTYPE employee : It defines that the root element of the document is employee.

16
<!ELEMENT employee: It defines that the employee element contains 3 elements "firstname,
lastname and email".
<!ELEMENT firstname: It defines that the firstname element is #PCDATA typed. (parse-able data
type).
<!ELEMENT lastname: It defines that the lastname element is #PCDATA typed. (parse-able data
type).
<!ELEMENT email: It defines that the email element is #PCDATA typed. (parse-able data type).

XML DTD with entity declaration:

A doctype declaration can also define special strings that can be used in the XML file.
An entity has three parts:
1. An ampersand (&)
2. An entity name
3. A semicolon (;)
Syntax to declare entity:
1. <!ENTITY entity-name "entity-value">

Let's see a code to define the ENTITY in doctype declaration.


author.xml

<?xml version="1.0" standalone="yes" ?>


<!DOCTYPE author [
<!ELEMENT author (#PCDATA)>
<!ENTITY sk "Sunil kumar ">
]>
<author>&sk;</author>
In the above example, sk is an entity that is used inside the author element. In such case, it will print
the value of sk entity that is "Sunil kumar".

TYPES of DTD
1. Internal DTD:

<!DOCTYPE root-element [element-declarations]>


example:
<?xml version="1.0"?>
<!DOCTYPE note [
<!ELEMENT note (to,from,heading,body)>
<!ELEMENT to (#CDATA)>
<!ELEMENT from (#CDATA)>
<!ELEMENT heading (#CDATA)>
<!ELEMENT body (#CDATA)>
]>
<note>
<to>cam</to>
<from>Jam</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend</body>
</note>

17
2. External DTD:
In this type , an axternal DTD file is created and its name must be specified in the corresponding
XML file. Following XML document illustrates the use of external DTD.
Step1: Creation of DTD file [ employee.dtd]
employee.dtd
<!ELEMENT employee (firstname,lastname,email)>
<!ELEMENT firstname (#PCDATA)>
<!ELEMENT lastname (#PCDATA)>
<!ELEMENT email (#PCDATA)>

Step 2: Creation of XML document. [employee.xml]

employee.xml
<?xml version="1.0"?>
<!DOCTYPE employee SYSTEM "employee.dtd">
<employee>
<firstname>vimal</firstname>
<lastname>kumar</lastname>
<email>vimal@xyz.com</email>
</employee>
In this a example, the DOCTYPE declaration refers to an external DTD file. The content of the file is
shown in below paragraph

18
XML Parsers

An XML parser is a software library or package that provides interfaces for client applications to
work with an XML document. The XML Parser is designed to read the XML and create a way for
programs to use XML.
XML parser validates the document and check that the document is well formatted.
Let's understand the working of XML parser by the figure given below:

Types of XML Parsers:

These are the two main types of XML Parsers:


1. DOM
2. SAX

3. DOM (Document Object Model):


A DOM document is an object which contains all the information of an XML document. It is
composed like a tree structure. The DOM Parser implements a DOM API. This API is very simple
to use.

Features of DOM Parser:


A DOM Parser creates an internal structure in memory which is a DOM document object and the
client applications get information of the original XML document by invoking methods on this
document object.
DOM Parser has a tree based structure.

Advantages:
1. It supports both read and write operations and the API is very simple to use.
2. It is preferred when random access to widely separated parts of a document is required.
3. Disadvantages
4. It is memory inefficient. (consumes more memory because the whole XML document needs
to loaded into memory).
5. It is comparatively slower than other parsers.

4. SAX (Simple API for XML):


A SAX Parser implements SAX API. This API is an event based API and less intuitive.

Features of SAX Parser:

It does not create any internal structure.


Clients does not know what methods to call, they just overrides the methods of the API and place
his own code inside method.
It is an event based parser, it works like an event handler in Java.
19
Advantages
1) It is simple and memory efficient.
2) It is very fast and works for huge documents.

Disadvantages
1) It is event-based so its API is less intuitive.
2) Clients never know the full information because the data is broken into pieces.

Difference between SAX and DOM parsers.


DOM SAX
Tree model parser (Tree of nodes) Event based parser (Sequence of
events)
DOM loads the file into the memory SAX parses the file at it reads i.e.
and then parse the file Parses node by node
Has memory constraints since it loads No memory constraints as it does not
the whole XML file before parsing store the XML content in the memory
DOM is read and write (can insert or SAX is read only i.e. can’t insert or
delete the node) delete the node
If the XML content is small then prefer Use SAX parser when memory content
DOM parser is large
Backward and forward search is SAX reads the XML file from top to
possible for searching the tags and bottom and backward navigation is not
evaluation of the information inside possible
the tags. So this gives the ease of
navigation
Slower at runtime Faster at runtime

XML DOM
DOM is an acronym stands for Document Object Model. It defines a standard way to access and
manipulate documents. The Document Object Model (DOM) is a programming API for HTML and
XML documents. It defines the logical structure of documents and the way a document is accessed
and manipulated.
As a W3C specification, one important objective for the Document Object Model is to provide a
standard programming interface that can be used in a wide variety of environments and applications.
The Document Object Model can be used with any programming language.
XML DOM defines a standard way to access and manipulate XML documents.

What does XML DOM:

The XML DOM makes a tree-structure view for an XML document.


We can access all elements through the DOM tree.
We can modify or delete their content and also create new elements. The elements, their content
(text and attributes) are all known as nodes.
For example, consider this table, taken from an HTML document:

<TABLE>
<ROWS>
<TR>
<TD>A</TD>

20
<TD>B</TD>
</TR>
<TR>
<TD>C</TD>
<TD>D</TD>
</TR>
</ROWS>
</TABLE>
The Document Object Model represents this table like this:

XML Schema
What is XML schema:

XML schema is a language which is used for expressing constraint about XML documents. There
are so many schema languages which are used now a days for example Relax- NG and XSD (XML
schema definition).
An XML schema is used to define the structure of an XML document. It is like DTD but provides
more control on XML structure.

Checking Validation

An XML document is called "well-formed" if it contains the correct syntax. A well-formed and
valid XML document is one which have been validated against Schema.

What is XML Schema Used For?

A Schema can be used:


1. to provide a list of elements and attributes in a vocabulary;
2. to associate data types, such as integer, string, etc., or more specifically such as hatsize,
sock_colour, etc., with values found in documents;

21
3. to constrain where elements and attributes can appear, and what can appear inside those
elements, such as saying that a chapter title occurs inside a chapter, and that a chapter must
consist of a chapter title followed by one or more paragraphs of text;
4. to provide documentation that is both human-readable and machine-processable;
5. to give a formal description of one or more documents.

What is the difference between XML Schema and DTD?

1. DTD is the predecessor of XML schema.


2. While DTD provides the basic structure/grammar for defining a XML document, in addition
to that XML schema provides methods to define constraints on the data contained in the
document. Therefore XML schema is considered to be richer and powerful than DTD.
3. Also, XML schema provides an object oriented approach for defining the structure of a XML
document. But since XML schema is a new technology, some XML parsers do not support it
yet.
4. XML Schema is namespace aware, while DTD is not.
5. XML Schemas are written in XML, while DTDs are not.
6. XML Schema is strongly typed, while DTD is not.
7. XML Schema has a wealth of derived and built-in data types that are not available in DTD.
8. XML Schema does not allow inline definitions, while DTD does.

How to write a Simple Schema?


Step 1: We will first write a simple xsd file in which the desired structure of XML document is
defined.

employee.xsd

<?xml version="1.0"?>
<xs:schema xmlns:xs=”http://www.w3.org/2001/XMLSchema”>
<xs:element name="employee">
<xs:complexType>
<xs:sequence>
<xs:element name="firstname" type="xs:string"/>
<xs:element name="lastname" type="xs:string"/>
<xs:element name="email" type="xs:string"/>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:schema>
The xs is a qualifier used to identify the schema elements and types. The document element of
schema is xs:schema. The xs:schema is the root element. It takes the attribute xmlns:xs which has
the value http://www.w3.org/2001/XMLSchema. This declaration indicates that document should
follow the rules of XML Schema. The XML Schema rules are defined by the W3 recommendation
in year 2001.
Then xs:element which is used to define the xml element. In the above example the element
employee is of complex type who have three child elements: firstname, lastname, email. All these
elements are of type string.
<xs:complexType> : It defines that the element 'employee' is complex type.
<xs:sequence> : It defines that the complex type is a sequence of elements.

22
Step 2: Now develop the XML document in which the desired values to the XML elements can be
given.
employee.xml
<?xml version="1.0"?>
<employee
xmlns="http://www.javatpoint.com"
xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
xsi:noNamespaceschemaLocation="employee.xsd">

<firstname>vimal</firstname>
<lastname>kumar</lastname>
<email>vimal@xyz.com</email>
</employee>
 The attribute xmlns:xsi indicates that XML document is an instance of XML schema and its
has come from the namespace http://www.w3.org/2001/XMLSchema-instance
 The xsi:noNamespaceschemaLocation attribute takes the name of the xsd file as vale.
Step 3: See the output in browser window.

XML Schema Data types

There are two types of data types in XML schema.


1. simpleType
2. complexType
SimpleType
The simpleType allows us to have text-based elements. It contains only text and does not contain
any other attribute and cannot be left empty.
Syntax:
xs: element name = “element_name” type= “data_type”
Here type can be any built in data type-
xs:string
xs: Boolean
xs: decimal
xs: date
xs:time
The simple type does not have attributes. But attributes are simple types.
Syntax:
xs: attribute name = “name of attribute” type= “data_type”
ComplexType
The complexType allows us to hold multiple attributes and elements. It can contain additional sub
elements and can be left empty.
Complex Type:
 empty elements
 elements that contain text
 element that contain other element
 element that contain text as well as other element.

23

You might also like