Anda di halaman 1dari 62

XML

1. XML stands for eXtensible Markup Language.


2. XML is designed to transport and store data.
3. XML is important to know, and very easy to
learn.
XML Document Example
<?xml version="1.0"?>
<note>
<to>Jack</to>
<from>John</from>
<heading>Reminder</heading>
<body>Don't forget me this weekend!</body>
</note>
1
What is XML?
• XML stands for EXtensible Markup Language
• XML is a markup language much like HTML
• XML was designed to carry data, not to
display data
• XML tags are not predefined. You must define
your own tags
• XML is designed to be self-descriptive
• XML is a W3C Recommendation

2
The Difference Between XML and HTML
1. XML is not a replacement for HTML.

HTML XML
1. HTML was designed to 1. XML was designed to
display data, with focus transport and store data,
on how data looks with focus on what data is

2. Has predefined tags 2. XML language has no


predefined tags.
3. To user
3. To computer
3
Use of XML
1. XML Separates Data from HTML
2. XML Simplifies Data Sharing

– In the real world, computer systems and


databases contain data in incompatible
formats.
– XML data is stored in plain text format.
This provides a software- and hardware-
independent way of storing data.
– This makes it much easier to create data
that can be shared by different
applications.
4
Use of XML
3. XML Simplifies Data Transport

– One of the most time-consuming challenges


for developers is to exchange data between
incompatible systems over the Internet.

– Exchanging data as XML greatly reduces


this complexity, since the data can be read
by different incompatible applications.

5
Use of XML
4. XML Simplifies Platform Changes
– Upgrading to new systems (hardware or
software platforms), is always time
consuming. Large amounts of data must be
converted and incompatible data is often
lost.
– XML data is stored in text format. This
makes it easier to expand or upgrade to
new operating systems, new applications, or
new browsers, without losing data.

6
XML Tree
<note>
<to>Jack</to> note
<from>John</from
>
<heading>
to from body
Reminder
</heading>
<body>
Don't forget me heading
this weekend!
</body>
</note>
7
<bookstore>
<book category="COOKING">
<title lang="en">Everyday Italian</title>
<author>Giada De Laurentiis</author>
<year>2005</year>
<price>30.00</price>
</book>
<book category="CHILDREN">
<title lang="en">Harry Potter</title>
<author>J K. Rowling</author>
<year>2005</year>
<price>29.99</price>
</book>
<book category="WEB">
<title lang="en">Learning XML</title>
<author>Erik T. Ray</author>
<year>2003</year>
<price>39.95</price>
</book>
</bookstore>
8
XML Syntax Rules( Well Formedness)
1. All XML Elements Must Have a
Closing Tag
2. XML Tags are Case Sensitive
3. XML Elements Must be Properly
Nested
4. XML Documents Must Have a Root
Element
5. XML Attribute Values Must be
Quoted

9
Attributes Vs Elements
There is no rules about that when to use
what.
<note> <note date=“10/02/2012”>
<date>10/02/2012</date> <to>Jack</to>
<to>Jack</to> <from>John</from>
<from>John</from> <heading>
<heading> Reminder
Reminder </heading>
</heading> <body>
<body> Don't forget me this
Don't forget me this weekend!
weekend! </body>
</body> </note>
</note>

10
Attributes Vs Elements
Disadvantages of using attributes
1. Cannot contain multiple values
2. Not expandable
3. Can not describe structure
4. Not easy to test against DTD

11
XML VALIDITY
1. Some XML documents are additionally
valid.
2. Valid documents must conform not only to
the syntax, but also to the DTD
(Document Type Definition).
3. DTD is a set of rules that defines what
tags appear in a XML document, so that
viewers of an XML document know what all
the tags mean.
went we. never school to
We never went to school
12
13
14
XML DTD
<?xml version=“1.0”?>
<!DOCTYPE note [
<!ELEMENT note (to, from, heading,
body)>
<!ELEMENT to (#PCDATA)>
<!ELEMENT from (#PCDATA)>
<!ELEMENT heading (#PCDATA)>
<!ELEMENT body (#PCDATA)>
]>

15
XML DTD
1. It defines legal building blocks of
an XML document.
2. It defines the document structure
with a list of legal elements.
3. A DTD can be declared inline in XML
document or as external reference
USE:
With a DTD, independent groups of
people can agree to use a common a
DTD for interchanging data.

16
XML DTD
DTD Elements
1. Declaring an Element
<! ELEMENT element-name (element-
content)>
2. EMPTY ELEMENTS
<!ELEMENT element-name (EMPTY)>
3. Elements with DATA
(CDATA) (#PCDATA) (ANY)
4. Elements with children
(child-elements)

17
XML DTD
DTD Elements
5. Wrapping:
<!DOCTYPE root-Element [Element-
Declarations]>
6. One occurrence
7. One or more occurrence(+)
8. Zero or more(*)
9. Zero or one(?)

18
XML DTD
DTD Attributes
1. Declaring Attributes
<!ATTLIST element-name attribute-
name
attribute-type
default-value>
Attribute type:
CDATA,ID,IDREF,IDREFS,ENTITY etc.

19
XML Entities
• Five special characters must be written as
entities:
&amp; for & (almost always necessary)
&lt; for < (almost always necessary)
&gt; for > (not usually necessary)
&quot; for " (necessary inside double quotes)
&apos; for ' (necessary inside single quotes)
• These entities can be used even in places
where they are not absolutely required
• These are the only predefined entities in XML

20
Question XML

Q1. Write an XML document to


represent the records of the
employees of an organization. Each
employee has a name, designation,
department, ID, salary, contact
number, adddress. Contact number
could be more than one. Name should
be represented in first, second and
last name format.
21
XML DTD
Default value can be one of them:
#REQUIRED –- The attribute is required
#IMPLIED-- The attribute is not required
#FIXED -- The attribute value is fixed
Enumerated Attribute Values
1. Use enumerated attribute values
when you want the attribute value to
be one of a fixed set of legal values
2. <!ATTLIST element-name
attribute-name (en1|en2|..) default-
value>
22
XML DTD
Internal
Define in document itself.
External
1. define in a separate file
2. add following line in xml document
<!DOCTYPE root SYSTEM “URLofDTD”>

23
DTD Entities
1. Entities are variables used to define
shortcuts to common text. Entity
references are references to entities
2. They allow to associate a name with
some other fragment of content.

3. Three types
1. Internal: for frequently typed text or text
that is expected to change
<!ENTITY entity-name “entity-value”>

2. External:
<!ENTITY entity-name SYSTEM “URL”>

24
XML QUIZ
Q1. What does XML stand for?
a) extensible Markup Language
b) X-Markup Language
c) Example Markup Language
d) extra Modern Link
Q2. Every XML document must have an
associated DTD or schema
a) True b) False

25
XML QUIZ
Q3. Which statement about XML is true?
a) Elements may nest but not overlap
b) Quoting attributes is optional
c) Elements may have multiple attributes with the
same name
Q4. What is the correct declaration syntax for
the version of XML document?
a) <?xml version="1.0" />
b) b) <?xml version="1.0"?>
c) c) <xml version="1.0" />
26
XML QUIZ
Q5. How is an empty element field
defined?
a) <name></name b) <name />
b) <name/> d) All of the above

Q6. XML document must be valid?


a) True b) False

Q7. Every XML document must be well


formed
a) True b) False
27
Limitations of DTD
1. DTD do not have any bulit in data type
2. DTD do not support user defined data types
3. DTD do not support name spaces
4. DTD do not object orientation.

what is the solution?


XML SCHEMA

28
XML Schema
• XML Schema is an XML-based alternative to DTD.
• An XML schema describes the structure of an XML
document.
• The XML Schema language is also referred to as XML
Schema Definition (XSD).

An XML Schema:
• defines elements that can appear in a document
• defines attributes that can appear in a document
• defines which elements are child elements
• defines the order of child elements
• defines the number of child elements
• defines whether an element is empty or can include text
• defines data types for elements and attributes
• defines default and fixed values for elements and
attributes
29
XML Schema
Buliding Blocks
1. Root of the schema is defined by <schema>,
qualified with namespace.
2. Simple elements
1. <xs:element name="xxx" type="yyy"/>
1. Types:
• xs:string
• xs:decimal
• xs:integer
• xs:boolean
• xs:date
• xs:time
30
XML Schema
Buliding Blocks
1. <xs:attribute name="xxx" type="yyy"/>
1. Types:
• xs:string
• xs:decimal
• xs:integer
• xs:boolean
• xs:date
• xs:time
2. Complex Elements
• empty elements
• elements that contain only other elements
• elements that contain only text
• elements that contain both other elements and text
31
XML Schema
Buliding Blocks
1. <xs:element name="employee">
<xs:complexType>
<xs:sequence>
<xs:element name="firstname"
type="xs:string"/>
<xs:element name="lastname"
type="xs:string"/>
</xs:sequence>
</xs:complexType>
</xs:element>

32
<?xml version="1.0"?>
<xs:schema
xmlns:xs="http://www.w3.org/2001/XMLSchema">
<xs:element name="note">
<xs:complexType>
<xs:sequence>
<xs:element name="to" type="xs:string"/>
<xs:element name="from" type="xs:string"/>
<xs:element name="heading" type="xs:string"/>
<xs:element name="body" type="xs:string"/>
</xs:sequence>
</xs:complexType>
</xs:element>
</xs:schema>

33
XSLT
• XSLT is a language for transforming
XML documents into XHTML documents
or to other XML documents.

– <xsl:template match=“/”>

34
XML DOM
What is the DOM?
1. The DOM is a W3C (World Wide Web Consortium) standard.
2. The DOM defines a standard for accessing documents like XML and
HTML:
“ The W3C Document Object Model (DOM) is a platform and
language-neutral interface that allows programs and scripts to
dynamically access and update the content, structure, and
style of a document."

3. The DOM is separated into 3 different parts / levels:


(I) Core DOM - standard model for any structured document
(II) XML DOM - standard model for XML documents
(III) HTML DOM - standard model for HTML documents

4. The DOM defines the objects and properties of all document


elements, and the methods (interface) to access them.

35
XML DOM
What is the XML DOM?
The XML DOM is:
1. A standard object model for XML
2. A standard programming interface for XML
Platform- and language-independent
3. A W3C standard
4. The XML DOM defines the objects and
properties of all XML elements, and the
methods (interface) to access them.
5. In other words: The XML DOM is a standard
for how to get, change, add, or delete XML
elements.

36
XML DOM
DOM Nodes
According to the DOM, everything in an
XML document is a node.

The DOM says:


– The entire document is a document node
– Every XML element is an element node
– The text in the XML elements are text nodes
– Every attribute is an attribute node
– Comments are comment nodes

37
XML DOM Parser
XML DOM - Properties and Methods
• XML DOM Properties
• These are some typical DOM properties:
• x.nodeName - the name of x
• x.nodeValue - the value of x
• x.parentNode - the parent node of x
• x.childNodes - the child nodes of x
• x.attributes - the attributes nodes of x
• XML DOM Methods
• x.getElementsByTagName(name) - get all
elements with a specified tag name
• x.appendChild(node) - insert a child node to x
• x.removeChild(node) - remove a child node from
x
38
Internet Explorer DOM
new ActiveXObject("Microsoft.XMLDOM");

39
Java Script

40
Java Script
• It was designed to add interactivity to
HTML pages
• A scripting language, lightweight
programming language
• It consists of lines of executable
computer code
• Usually embedded directly into HTML
pages
• Interpreted language

41
Java Script can do…
• Java script can react to events
• It can validate user data
• It can be used to perform client side
dynamism

• Java Script code should be placed in


script tag.
• <script type=“text/javascript”>
• It gets invoked when page loads in
browser
42
Where to put script
• some times we want the script to be
invoked when an event occurs.
• Place it in head section if, it is to be
invoked when an event occur
• Place it in body if it is to be executed
when page loads
• You may write script in a separate file
with out script tag and save it as .js
extension, then put following line in
HTML page.
<script src=“XXX.js”></script> 43
Building Blocks
Variable:
i. Case sensitive
ii. Must begin with letter or underscore
iii. var variablename=value;
Conditional Statements:
• if statement
• if-else
• Switch statement
Operators:
1. Arithmetic 2. Assignment 3. Comparison
2. Logical 5. conditional 6. String
LOOPs: for, while, do-while
44
Example#01

<html>
<body>
<script type="text/javascript">
document.write("hello world")
</script>
</body>
</html>

45
Java Script popup boxes
Alert Box:
used to make sure that information
comes through user. OK
alert(“some text”);
Confirm Box:
to verify or accept something; OK,
Cancel
if clicks OK - true
if clicks Cancel  false
confirm(„”some text”);
46
Java Script popup boxes
Prompt Box:
used to take a value from user
before entering a page.

if clicks OK - value
if clicks Cancel  null
prompt(„”some text”, ”default value”)

47
Example#02
<html>
<body>
<script type="text/javascript">
document.write("hello world")
alert("Is this III Year CS")
prompt("enter your roll number ", "rollno")
confirm("sure to submit it")
</script>
</body>
</html>
48
Java Script function
function func-name(var1,var2...varx)
{
some code of script
return(something) if function returns
}

function display()
{
alert(“hello”)
} 49
Example#03
<html>
<head>
<script type="text/javascript">
function disp()
{
alert(“hello”)
}
</script>
</head>
<body>
<form>
<input type="button“ value=“ok“ onclick=“disp()”>

</form>
</body>
</html>
50
Java Script array

var myarray = new Array(3);


myarray[0] = “element-1”
myarray[1] = “element-2”
myarray[2] = “element-3”
or
var myarray = new Array(“el-1”, “el-2” “el-3”)

51
Java Script EVENTS
1.Onload and onUnload
2.onFocus, onBlur, onChange
3.onSubmit
4.Onmouseover, onmouseout
Error Handling
try and catch(err)

52
Example#04
<html>
<body>
<script type="text/javascript">
document.write("<table width=1 0 0 % bgcolor='green'>")
for(I =0 ; I < 5 ; I + + )
{

document.write("<tr><td align='center'> “ + “ I = “
+ “ < / td>")
document.write("< td align='center'> “ + I + “
</td></tr>")

}
document.write("</table>")
</script>
</body>
</html>

53
W3C DOM with JavaScript
• Example # 01 : Loading the XML document: DOMDocument
 The programmer can use a Microsoft Active X object to
parse an XML file

var XMLfile = new ActiveXObject(" Microsoft.XMLDOM");


XMLfile.load(“example.xml");
var rootElement = XMLfile.documentElement;
document.write("The root node of the XML file is: ");
document.writeln("<b>" + rootElement.nodeName +"</b>");

54
W3C DOM with JavaScript
• Example 2: Accessing the Children Elements
 The childNodes member of any element node gives the
programmer access to all of the sibling nodes of that
element
//traverse through each child of the root element
//and print out its name
for (i=0; i<rootElement.childNodes.length; i++)
{
var node = rootElement.childNodes.item(i);
document.write("The name of the node is ");
document.write("<b>" + node.nodeName + "</b>");
}

55
W3C DOM with JavaScript
• Example 3: Getting Element Attributes

//traverse through each child of the root element


//and print out its name
for (i=0; i<rootElement.childNodes.length; i++) {
//get the current element
var elementNode = rootElement.childNodes.item(i);
document.writeln("Processing Node: " +
elementNode.nodeName + "<BR>");

var attributeValue;
//get an attribute value by specific name
attributeValue = elementNode.getAttribute("articleID");
//print it out
document.writeln("Attribute value: <b>" + attributeValue
+
" </b><br>");
}
56
Cautions with DOM
• Make sure that the XML file resides in the same directory as
the html file with the JavaScript code

• The Attribute node does not appear as the child node of any
other node type; it is not considered a child node of an
element

• Use caution when outputting raw XML to Internet Explorer.If


the programmer uses the document.writeln method, IE
attempts to interpret the XML tags and jumbles the text.
Instead, use an alert box when debugging.

57
Java Script Form validation
• JavaScript can be used to validate data
in HTML forms before sending off the
content to a server.
• Form data that typically are checked by
a JavaScript could be:
– has the user left required fields empty?
– has the user entered a valid e-mail
address?
– has the user entered a valid date?
– has the user entered text in a numeric
field? 58
Java Script Form validation
function validateForm(form)
{
var x=form.fname.value;
if (x==null || x=="")
{
alert("First name must be filled out");
return false;
}
}

59
<form name="myForm" action=""
onsubmit="return validateForm()"
method="post">

First name: <input type="text“ name="fname">

<input type="submit" value="Submit">

</form>

60
How to specify Relative pathnames
The current HTML document is my.html and the current directory is Iam
C:\- Iam -my.html
-your.html

Type this ; <A href=your.html>Your link </A>

C:\- Iam -my.html


Child -your.html
Type this ; <A href=Child/your.html>Your link </A>

C:\-  Iam -my.html


 Sister -your.html
Type this ; <A href=../Sister/your.html>Your link </A>

C:\-  Mother -your.html


 Iam -my.html
Type this ; <A href=../your.html>Your link </A>

61
How to specify Relative pathnames
The HTML document is my.html and the image file is dragonfly.gif
C:\-
 Iam -my.html ☞ Type this ; <IMG SRC=dragonfly.gif>
-dragonfly.gif

C:\-  Iam -my.html ☞ Type this ; <IMG SRC=Image/dragonfly.gif>


 Image
-dragonfly.gif

C:\-  Iam -my.html ☞ Type this ; <IMG SRC=../Image/dragonfly.gif>


 Image
-dragonfly.gif

C:\-  Image -dragonfly.gif ☞ Type this ; <IMG SRC=../dragonfly.gif>


 Iam
-my.html

62

Anda mungkin juga menyukai