SlideShare a Scribd company logo
MB
S

mbstechinfo@gmail.com
MB
S

Introduction
Introducing the DOM Objects

Working with the XML DOM
Validate and tranform an XML document

Exercises

Document Object Model

Sli
de
2
MB
S

Introducing the W3C DOM
 DOM Implementation


Document Object Model

Sli
de
3


XML Document Object Model (DOM)

MB
S

◦ W3C standard recommendation
◦ Build tree structure in memory for XML documents
◦ Provides an Application Programming Interface (API) for
dynamically accessing and manipulating a document
◦ DOM-based parsers parse these structures
 Exist in several languages (Java, C, C++, Python, Perl, etc.)

Document Object Model

Sli
de
4


Tree Structure of a Document:

MB
S

◦ Node is the basic building block of the DOM tree
structure.
◦ Nodes represent elements, attributes, content,
comments, etc.

Document Object Model

Sli
de
5
◦ Example
<?xml version = "1.0"?>
<message from = "Paul" to = "Tem">
<body>Hi, Tim!</body>
</message>

MB
S

 Node created for element message

 Element message has child node for body element
 Element body has child node for text "Hi, Tim!"
 Attributes from and to also have nodes in tree

Document Object Model

Sli
de
6
MB
S

The following figure represents how a DOM tree is used by applications to access data:

MSXML Library or other libraries
XML
Document

Parser
Parsed
Document

DOM Tree
Root
Child

Application
Text

Child
Text

Document Object Model

Sli
de
7


MB
S

DOM-based parsers
◦
◦
◦
◦
◦
◦
◦
◦
◦

Sun Microsystem’s JAXP
Apache Xerces
XML4J
DOM4J
JDOM
Microsoft’s msxml
4DOM
XML::DOM
…

Document Object Model

Sli
de
8
MB
S

Class/Interface

Description

Document interface

Represents the XML document’s top-level node, which provides
access to all the document’s nodes—including the root element.

Node interface

Represents an XML document node.

NodeList interface

Represents a read-only list of Node objects.

Element interface

Represents an element node. Derives from Node.

Attr interface

Represents an attribute node. Derives from Node.

CharacterData interface Represents character data. Derives from Node.
Text interface
Represents a text node. Derives from CharacterData.
Comment interface

Represents a comment node. Derives from CharacterData.

ProcessingInstruction
interface
CDATASection interface

Represents a processing instruction node. Derives from Node.
Represents a CDATA section. Derives from Text.

Document Object Model

Sli
de
9
Method Name

Description

createElement

Creates an element node.

createAttribute

Creates an attribute node.

createTextNode

Creates a text node.

createComment

MB
S

Creates a comment node.

createProcessingInstruction Creates a processing instruction node.
createCDATASection
Creates a CDATA section node.
getDocumentElement

Returns the document’s root element.

appendChild

Appends a child node.

getChildNodes

Returns the child nodes.

Document Object Model

Sli
de
10


MB
Following are the associated properties for the
S
Document object methods:
◦
◦
◦
◦
◦
◦

childNodes
documentElement
firstChild
lastChild
parseError
validateOnParse

Document Object Model

Sli
de
11
Method Name

Description

appendChild

Appends a child node.

cloneNode

Duplicates the node.

getAttributes Returns the node’s attributes.

MB
S

getChildNodes Returns the node’s child nodes.
getNodeName

Returns the node’s name.

getNodeType

Returns the node’s type (e.g., element, attribute,
text, etc.).

getNodeValue

Returns the node’s value.

getParentNode Returns the node’s parent.
hasChildNodes Returns true if the node has child nodes.
removeChild

Removes a child node from the node.

replaceChild

Replaces a child node with another node.

setNodeValue

Sets the node’s value.

insertBefore

Appends a child node in front of a child node.

Document Object Model

Sli
de
12


MB
Following are the associated properties Sthe
for
Node object methods:
◦
◦
◦
◦
◦
◦
◦

nodeName
nodeType
nodeValue
childNodes
firstChild
lastChild
text

Document Object Model

Sli
de
13
MB
S

Node Type

Description

Node.ELEMENT_NODE

Represents an element node.

Node.ATTRIBUTE_NODE

Represents an attribute node.

Node.TEXT_NODE

Represents a text node.

Node.COMMENT_NODE

Represents a comment node.

Node.PROCESSING_INSTRUCTION_NODE

Represents a processing instruction node.

Node.CDATA_SECTION_NODE

Represents a CDATA section node.

Document Object Model

Sli
de
14
MB
S
Method Name

Description

getAttribute

Returns an attribute’s value.

getTagName

Returns an element’s name.

removeAttribute

Removes an element’s attribute.

setAttribute

Sets an attribute’s value.

Document Object Model

Sli
de
15
MB
S

<?xml version="1.0"?>
<article>
<title>XML Demo</title>
<date>August 22, 2007</date>
<author>
<fname>Nguyen Van</fname>
<lname>Teo</lname>
</author>
<summary>XML is pretty easy.</summary>
<content>Once you have mastered HTML, XML is
easily
learned. You must remember that XML is not for
displaying information but for managing
information.
</content>
</article>

Document Object Model

Sli
de
16
MB
S

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>A DOM Example</title>
</head>
<body>

Element script allows for
including scripting code

<script type = "text/javascript" language
"JavaScript">

Instantiate
Microsoft XML
=
DOM object

var xmlDoc=new ActiveXObject("Microsoft.XMLDOM");
xmlDoc.load("article.xml");
Load article.xml into memory;
var

msxml parses article.xml and
element=xmlDoc.documentElement; stores it as tree structure

Document Object Model

Sli
de
17
Assign article as root element
var element=xmlDoc.documentElement;// get the root element
document.writeln(
"<p>Here is the root node of the document:" );
document.writeln( "<strong>" + element.nodeName
+ "</strong>" );

MB
S

Place root element’s name in element
strong and write it to browser

document.writeln(
"<br>The following are its child elements:" );
document.writeln( "</p><ul>" );

// traverse all child nodes of root element
for ( i = 0; i < element.childNodes.length; i++ ) {
var curNode = element.childNodes.item(i);

}

// print node name of each child element
document.writeln( "<li><strong>" + curNode.nodeName
+ "</strong></li>" );

Assign index to each
child node of root node

document.writeln( "</ul>" );
// get the first child node of root element
var currentNode = element.firstChild;

Retrieve root node’s first
child node (title)
Document Object Model

Sli
de
18
MB
S

Siblings are nodes at same level in

document.writeln( "<p>The first child of root node is:" );
document (e.g., title, date,
document.writeln( "<strong>" + currentNode.nodeName
+ "</strong>" );
author, summary and content)
document.writeln( "<br>whose next sibling is:" );
// get the next sibling of first child
var nextSib = currentNode.nextSibling;
document.writeln( "<strong>" + nextSib.nodeName
+ "</strong>." );
Get first child’s next sibling (date)
document.writeln( "<br>Value of <strong>" + nextSib.nodeName
+ "</strong> element is:" );
var value = nextSib.firstChild;

Get first child of date

// print the text value of the sibling
document.writeln( "<em>" + value.nodeValue + "</em>" );
document.writeln( "<br>Parent node of " );
document.writeln( "<strong>" + nextSib.nodeName
+ "</strong> is:" );
document.writeln( "<strong>" + nextSib.parentNode.nodeName
+ "</strong>.</p>" );
</script>
</body>
</html>

Get parent of date (article)

Document Object Model

Sli
de
19
MB
S

Document Object Model

Sli
de
20
Validate XML document with DTD
 Read XML document


Document Object Model

MB
S

Sli
de
21


MB
S

To be continued…

Document Object Model

Sli
de
22
MB
S

XML How to program
 http://www.w3.org
 XML tutorial http://www.w3schools.com/w3c/


Document Object Model

Sli
de
23
MB
S

Feel free to post questions at
http://yht4ever.blogspot.com
 or email to:
thanh.phamhong@niithoasen.com or
thanh.phamhong@niit-vn.com


Document Object Model

Sli
de
24
MB
S

mbstechinfo@gmail.com

More Related Content

PPTX
XML Document Object Model (DOM)
BOSS Webtech
 
PPT
Understanding XML DOM
Om Vikram Thapa
 
PPTX
Dom
Surinder Kaur
 
PPTX
INTRODUCTION TO DOM AND DOM TREE
systematiclab
 
PPTX
Introduction to the DOM
tharaa abu ashour
 
PPT
Document Object Model
yht4ever
 
PPTX
Document Object Model (DOM)
GOPAL BASAK
 
XML Document Object Model (DOM)
BOSS Webtech
 
Understanding XML DOM
Om Vikram Thapa
 
INTRODUCTION TO DOM AND DOM TREE
systematiclab
 
Introduction to the DOM
tharaa abu ashour
 
Document Object Model
yht4ever
 
Document Object Model (DOM)
GOPAL BASAK
 

What's hot (18)

PPTX
Dom(document object model)
Partnered Health
 
PPT
Document Object Model
chomas kandar
 
PDF
JavaScript DOM & event
Borey Lim
 
PPTX
The Document Object Model
Khou Suylong
 
PPTX
Xml dom
sana mateen
 
PPTX
Dom parser
sana mateen
 
PPT
DOM and SAX
Jussi Pohjolainen
 
PPT
introduction to the document object model- Dom chapter5
FLYMAN TECHNOLOGY LIMITED
 
PPT
Xml Lecture Notes
Santhiya Grace
 
PPTX
An Introduction to the DOM
Mindy McAdams
 
PDF
Dom Hackking & Security - BlackHat Preso
Shreeraj Shah
 
PPTX
Document Object Model
Mayur Mudgal
 
PDF
JavaScript and DOM
Jussi Pohjolainen
 
PPTX
Internet and Web Technology (CLASS-7) [XML and AJAX] | NIC/NIELIT Web Technology
Ayes Chinmay
 
PPTX
Xml part 6
NOHA AW
 
PDF
Unit 4(it workshop)
Dr.Lokesh Gagnani
 
Dom(document object model)
Partnered Health
 
Document Object Model
chomas kandar
 
JavaScript DOM & event
Borey Lim
 
The Document Object Model
Khou Suylong
 
Xml dom
sana mateen
 
Dom parser
sana mateen
 
DOM and SAX
Jussi Pohjolainen
 
introduction to the document object model- Dom chapter5
FLYMAN TECHNOLOGY LIMITED
 
Xml Lecture Notes
Santhiya Grace
 
An Introduction to the DOM
Mindy McAdams
 
Dom Hackking & Security - BlackHat Preso
Shreeraj Shah
 
Document Object Model
Mayur Mudgal
 
JavaScript and DOM
Jussi Pohjolainen
 
Internet and Web Technology (CLASS-7) [XML and AJAX] | NIC/NIELIT Web Technology
Ayes Chinmay
 
Xml part 6
NOHA AW
 
Unit 4(it workshop)
Dr.Lokesh Gagnani
 
Ad

Viewers also liked (15)

PDF
24sax
Adil Jafri
 
PDF
Xml & Java
Slim Ouertani
 
PPT
XML
thotasrinath
 
PPT
Simple API for XML
guest2556de
 
PPT
RESTful services with JAXB and JPA
Shaun Smith
 
PDF
SAX, DOM & JDOM parsers for beginners
Hicham QAISSI
 
PPT
6 xml parsing
gauravashq
 
PDF
WEB PROGRAMMING UNIT IV NOTES BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
PPT
Session 5
Lại Đức Chung
 
PDF
XML parsing using jaxb
Malintha Adikari
 
PPTX
SAX (con PHP)
DaCoom
 
PPT
XML SAX PARSING
Eviatar Levy
 
PPT
Xml parsers
Manav Prasad
 
PPT
Java XML Parsing
srinivasanjayakumar
 
24sax
Adil Jafri
 
Xml & Java
Slim Ouertani
 
Simple API for XML
guest2556de
 
RESTful services with JAXB and JPA
Shaun Smith
 
SAX, DOM & JDOM parsers for beginners
Hicham QAISSI
 
6 xml parsing
gauravashq
 
WEB PROGRAMMING UNIT IV NOTES BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
XML parsing using jaxb
Malintha Adikari
 
SAX (con PHP)
DaCoom
 
XML SAX PARSING
Eviatar Levy
 
Xml parsers
Manav Prasad
 
Java XML Parsing
srinivasanjayakumar
 
Ad

Similar to Xml dom & sax by bhavsingh maloth (20)

PPT
6867389.ppt
SunilChaluvaiah
 
PPT
6867389 (1).ppt
SunilChaluvaiah
 
PPT
6867389.ppt
SunilChaluvaiah
 
PPT
Javascript.ppt
NoralieNicol
 
PPTX
Document object model
Amit kumar
 
PPTX
DOM and Events
Julie Iskander
 
PPTX
12. session 12 java script objects
Phúc Đỗ
 
PPT
Web Performance Tips
Ravi Raj
 
PDF
Mongo learning series
Prashanth Panduranga
 
PDF
Pyconie 2012
Yaqi Zhao
 
PPT
Automating Ievb
nageshreddy15
 
PDF
Web2py tutorial to create db driven application.
fRui Apps
 
PDF
Java script
Yoga Raja
 
PPS
04 sm3 xml_xp_07
Niit Care
 
PDF
Lotusphere 2007 AD507 Leveraging the Power of Object Oriented Programming in ...
Bill Buchan
 
DOCX
DOM(Document Object Model) in javascript
Rashmi Mishra
 
PPTX
java API for XML DOM
Surinder Kaur
 
PDF
Introduction to Javascript
Seble Nigussie
 
PPTX
La sql
James Johnson
 
6867389.ppt
SunilChaluvaiah
 
6867389 (1).ppt
SunilChaluvaiah
 
6867389.ppt
SunilChaluvaiah
 
Javascript.ppt
NoralieNicol
 
Document object model
Amit kumar
 
DOM and Events
Julie Iskander
 
12. session 12 java script objects
Phúc Đỗ
 
Web Performance Tips
Ravi Raj
 
Mongo learning series
Prashanth Panduranga
 
Pyconie 2012
Yaqi Zhao
 
Automating Ievb
nageshreddy15
 
Web2py tutorial to create db driven application.
fRui Apps
 
Java script
Yoga Raja
 
04 sm3 xml_xp_07
Niit Care
 
Lotusphere 2007 AD507 Leveraging the Power of Object Oriented Programming in ...
Bill Buchan
 
DOM(Document Object Model) in javascript
Rashmi Mishra
 
java API for XML DOM
Surinder Kaur
 
Introduction to Javascript
Seble Nigussie
 

More from Bhavsingh Maloth (20)

PPT
web programming Unit VI PPT by Bhavsingh Maloth
Bhavsingh Maloth
 
PDF
web programming Unit VIII complete about python by Bhavsingh Maloth
Bhavsingh Maloth
 
PDF
web programming UNIT VIII python by Bhavsingh Maloth
Bhavsingh Maloth
 
PDF
Web programming unit IIII XML &DOM NOTES BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
PDF
WEB PROGRAMMING UNIT VIII BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
PDF
WEB PROGRAMMING UNIT VI BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
PDF
WEB PROGRAMMING UNIT V BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
PDF
WEB PROGRAMMING UNIT II BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
PDF
Web programming UNIT II by Bhavsingh Maloth
Bhavsingh Maloth
 
PDF
Polytechnic jan 6 2012
Bhavsingh Maloth
 
PDF
Appscpolytechniclecturersg.s.paper2007
Bhavsingh Maloth
 
PDF
Appsc poly key 2013
Bhavsingh Maloth
 
PDF
Appscpolytechniclecturersg.s.paper2007
Bhavsingh Maloth
 
PDF
Appsc poly key 2013
Bhavsingh Maloth
 
PDF
98286173 government-polytechnic-lecturer-exam-paper-2012
Bhavsingh Maloth
 
PPT
Unit vii wp ppt
Bhavsingh Maloth
 
PDF
Unit VI
Bhavsingh Maloth
 
PDF
Wp unit III
Bhavsingh Maloth
 
PDF
Web Programming UNIT VIII notes
Bhavsingh Maloth
 
PDF
Wp unit 1 (1)
Bhavsingh Maloth
 
web programming Unit VI PPT by Bhavsingh Maloth
Bhavsingh Maloth
 
web programming Unit VIII complete about python by Bhavsingh Maloth
Bhavsingh Maloth
 
web programming UNIT VIII python by Bhavsingh Maloth
Bhavsingh Maloth
 
Web programming unit IIII XML &DOM NOTES BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
WEB PROGRAMMING UNIT VIII BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
WEB PROGRAMMING UNIT VI BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
WEB PROGRAMMING UNIT V BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
WEB PROGRAMMING UNIT II BY BHAVSINGH MALOTH
Bhavsingh Maloth
 
Web programming UNIT II by Bhavsingh Maloth
Bhavsingh Maloth
 
Polytechnic jan 6 2012
Bhavsingh Maloth
 
Appscpolytechniclecturersg.s.paper2007
Bhavsingh Maloth
 
Appsc poly key 2013
Bhavsingh Maloth
 
Appscpolytechniclecturersg.s.paper2007
Bhavsingh Maloth
 
Appsc poly key 2013
Bhavsingh Maloth
 
98286173 government-polytechnic-lecturer-exam-paper-2012
Bhavsingh Maloth
 
Unit vii wp ppt
Bhavsingh Maloth
 
Wp unit III
Bhavsingh Maloth
 
Web Programming UNIT VIII notes
Bhavsingh Maloth
 
Wp unit 1 (1)
Bhavsingh Maloth
 

Recently uploaded (20)

PPTX
Five Point Someone – Chetan Bhagat | Book Summary & Analysis by Bhupesh Kushwaha
Bhupesh Kushwaha
 
PPTX
Virus sequence retrieval from NCBI database
yamunaK13
 
PDF
The-Invisible-Living-World-Beyond-Our-Naked-Eye chapter 2.pdf/8th science cur...
Sandeep Swamy
 
PPTX
CONCEPT OF CHILD CARE. pptx
AneetaSharma15
 
PPTX
INTESTINALPARASITES OR WORM INFESTATIONS.pptx
PRADEEP ABOTHU
 
PPTX
CARE OF UNCONSCIOUS PATIENTS .pptx
AneetaSharma15
 
PPTX
Artificial Intelligence in Gastroentrology: Advancements and Future Presprec...
AyanHossain
 
PPTX
HISTORY COLLECTION FOR PSYCHIATRIC PATIENTS.pptx
PoojaSen20
 
DOCX
pgdei-UNIT -V Neurological Disorders & developmental disabilities
JELLA VISHNU DURGA PRASAD
 
PDF
Biological Classification Class 11th NCERT CBSE NEET.pdf
NehaRohtagi1
 
DOCX
Unit 5: Speech-language and swallowing disorders
JELLA VISHNU DURGA PRASAD
 
PPTX
How to Close Subscription in Odoo 18 - Odoo Slides
Celine George
 
PDF
Module 2: Public Health History [Tutorial Slides]
JonathanHallett4
 
PPTX
Basics and rules of probability with real-life uses
ravatkaran694
 
PPTX
CDH. pptx
AneetaSharma15
 
PDF
Health-The-Ultimate-Treasure (1).pdf/8th class science curiosity /samyans edu...
Sandeep Swamy
 
PPTX
family health care settings home visit - unit 6 - chn 1 - gnm 1st year.pptx
Priyanshu Anand
 
PPTX
Gupta Art & Architecture Temple and Sculptures.pptx
Virag Sontakke
 
PPTX
Cleaning Validation Ppt Pharmaceutical validation
Ms. Ashatai Patil
 
PPTX
Kanban Cards _ Mass Action in Odoo 18.2 - Odoo Slides
Celine George
 
Five Point Someone – Chetan Bhagat | Book Summary & Analysis by Bhupesh Kushwaha
Bhupesh Kushwaha
 
Virus sequence retrieval from NCBI database
yamunaK13
 
The-Invisible-Living-World-Beyond-Our-Naked-Eye chapter 2.pdf/8th science cur...
Sandeep Swamy
 
CONCEPT OF CHILD CARE. pptx
AneetaSharma15
 
INTESTINALPARASITES OR WORM INFESTATIONS.pptx
PRADEEP ABOTHU
 
CARE OF UNCONSCIOUS PATIENTS .pptx
AneetaSharma15
 
Artificial Intelligence in Gastroentrology: Advancements and Future Presprec...
AyanHossain
 
HISTORY COLLECTION FOR PSYCHIATRIC PATIENTS.pptx
PoojaSen20
 
pgdei-UNIT -V Neurological Disorders & developmental disabilities
JELLA VISHNU DURGA PRASAD
 
Biological Classification Class 11th NCERT CBSE NEET.pdf
NehaRohtagi1
 
Unit 5: Speech-language and swallowing disorders
JELLA VISHNU DURGA PRASAD
 
How to Close Subscription in Odoo 18 - Odoo Slides
Celine George
 
Module 2: Public Health History [Tutorial Slides]
JonathanHallett4
 
Basics and rules of probability with real-life uses
ravatkaran694
 
CDH. pptx
AneetaSharma15
 
Health-The-Ultimate-Treasure (1).pdf/8th class science curiosity /samyans edu...
Sandeep Swamy
 
family health care settings home visit - unit 6 - chn 1 - gnm 1st year.pptx
Priyanshu Anand
 
Gupta Art & Architecture Temple and Sculptures.pptx
Virag Sontakke
 
Cleaning Validation Ppt Pharmaceutical validation
Ms. Ashatai Patil
 
Kanban Cards _ Mass Action in Odoo 18.2 - Odoo Slides
Celine George
 

Xml dom & sax by bhavsingh maloth

  • 2. MB S Introduction Introducing the DOM Objects Working with the XML DOM Validate and tranform an XML document Exercises Document Object Model Sli de 2
  • 3. MB S Introducing the W3C DOM  DOM Implementation  Document Object Model Sli de 3
  • 4.  XML Document Object Model (DOM) MB S ◦ W3C standard recommendation ◦ Build tree structure in memory for XML documents ◦ Provides an Application Programming Interface (API) for dynamically accessing and manipulating a document ◦ DOM-based parsers parse these structures  Exist in several languages (Java, C, C++, Python, Perl, etc.) Document Object Model Sli de 4
  • 5.  Tree Structure of a Document: MB S ◦ Node is the basic building block of the DOM tree structure. ◦ Nodes represent elements, attributes, content, comments, etc. Document Object Model Sli de 5
  • 6. ◦ Example <?xml version = "1.0"?> <message from = "Paul" to = "Tem"> <body>Hi, Tim!</body> </message> MB S  Node created for element message  Element message has child node for body element  Element body has child node for text "Hi, Tim!"  Attributes from and to also have nodes in tree Document Object Model Sli de 6
  • 7. MB S The following figure represents how a DOM tree is used by applications to access data: MSXML Library or other libraries XML Document Parser Parsed Document DOM Tree Root Child Application Text Child Text Document Object Model Sli de 7
  • 8.  MB S DOM-based parsers ◦ ◦ ◦ ◦ ◦ ◦ ◦ ◦ ◦ Sun Microsystem’s JAXP Apache Xerces XML4J DOM4J JDOM Microsoft’s msxml 4DOM XML::DOM … Document Object Model Sli de 8
  • 9. MB S Class/Interface Description Document interface Represents the XML document’s top-level node, which provides access to all the document’s nodes—including the root element. Node interface Represents an XML document node. NodeList interface Represents a read-only list of Node objects. Element interface Represents an element node. Derives from Node. Attr interface Represents an attribute node. Derives from Node. CharacterData interface Represents character data. Derives from Node. Text interface Represents a text node. Derives from CharacterData. Comment interface Represents a comment node. Derives from CharacterData. ProcessingInstruction interface CDATASection interface Represents a processing instruction node. Derives from Node. Represents a CDATA section. Derives from Text. Document Object Model Sli de 9
  • 10. Method Name Description createElement Creates an element node. createAttribute Creates an attribute node. createTextNode Creates a text node. createComment MB S Creates a comment node. createProcessingInstruction Creates a processing instruction node. createCDATASection Creates a CDATA section node. getDocumentElement Returns the document’s root element. appendChild Appends a child node. getChildNodes Returns the child nodes. Document Object Model Sli de 10
  • 11.  MB Following are the associated properties for the S Document object methods: ◦ ◦ ◦ ◦ ◦ ◦ childNodes documentElement firstChild lastChild parseError validateOnParse Document Object Model Sli de 11
  • 12. Method Name Description appendChild Appends a child node. cloneNode Duplicates the node. getAttributes Returns the node’s attributes. MB S getChildNodes Returns the node’s child nodes. getNodeName Returns the node’s name. getNodeType Returns the node’s type (e.g., element, attribute, text, etc.). getNodeValue Returns the node’s value. getParentNode Returns the node’s parent. hasChildNodes Returns true if the node has child nodes. removeChild Removes a child node from the node. replaceChild Replaces a child node with another node. setNodeValue Sets the node’s value. insertBefore Appends a child node in front of a child node. Document Object Model Sli de 12
  • 13.  MB Following are the associated properties Sthe for Node object methods: ◦ ◦ ◦ ◦ ◦ ◦ ◦ nodeName nodeType nodeValue childNodes firstChild lastChild text Document Object Model Sli de 13
  • 14. MB S Node Type Description Node.ELEMENT_NODE Represents an element node. Node.ATTRIBUTE_NODE Represents an attribute node. Node.TEXT_NODE Represents a text node. Node.COMMENT_NODE Represents a comment node. Node.PROCESSING_INSTRUCTION_NODE Represents a processing instruction node. Node.CDATA_SECTION_NODE Represents a CDATA section node. Document Object Model Sli de 14
  • 15. MB S Method Name Description getAttribute Returns an attribute’s value. getTagName Returns an element’s name. removeAttribute Removes an element’s attribute. setAttribute Sets an attribute’s value. Document Object Model Sli de 15
  • 16. MB S <?xml version="1.0"?> <article> <title>XML Demo</title> <date>August 22, 2007</date> <author> <fname>Nguyen Van</fname> <lname>Teo</lname> </author> <summary>XML is pretty easy.</summary> <content>Once you have mastered HTML, XML is easily learned. You must remember that XML is not for displaying information but for managing information. </content> </article> Document Object Model Sli de 16
  • 17. MB S <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>A DOM Example</title> </head> <body> Element script allows for including scripting code <script type = "text/javascript" language "JavaScript"> Instantiate Microsoft XML = DOM object var xmlDoc=new ActiveXObject("Microsoft.XMLDOM"); xmlDoc.load("article.xml"); Load article.xml into memory; var msxml parses article.xml and element=xmlDoc.documentElement; stores it as tree structure Document Object Model Sli de 17
  • 18. Assign article as root element var element=xmlDoc.documentElement;// get the root element document.writeln( "<p>Here is the root node of the document:" ); document.writeln( "<strong>" + element.nodeName + "</strong>" ); MB S Place root element’s name in element strong and write it to browser document.writeln( "<br>The following are its child elements:" ); document.writeln( "</p><ul>" ); // traverse all child nodes of root element for ( i = 0; i < element.childNodes.length; i++ ) { var curNode = element.childNodes.item(i); } // print node name of each child element document.writeln( "<li><strong>" + curNode.nodeName + "</strong></li>" ); Assign index to each child node of root node document.writeln( "</ul>" ); // get the first child node of root element var currentNode = element.firstChild; Retrieve root node’s first child node (title) Document Object Model Sli de 18
  • 19. MB S Siblings are nodes at same level in document.writeln( "<p>The first child of root node is:" ); document (e.g., title, date, document.writeln( "<strong>" + currentNode.nodeName + "</strong>" ); author, summary and content) document.writeln( "<br>whose next sibling is:" ); // get the next sibling of first child var nextSib = currentNode.nextSibling; document.writeln( "<strong>" + nextSib.nodeName + "</strong>." ); Get first child’s next sibling (date) document.writeln( "<br>Value of <strong>" + nextSib.nodeName + "</strong> element is:" ); var value = nextSib.firstChild; Get first child of date // print the text value of the sibling document.writeln( "<em>" + value.nodeValue + "</em>" ); document.writeln( "<br>Parent node of " ); document.writeln( "<strong>" + nextSib.nodeName + "</strong> is:" ); document.writeln( "<strong>" + nextSib.parentNode.nodeName + "</strong>.</p>" ); </script> </body> </html> Get parent of date (article) Document Object Model Sli de 19
  • 21. Validate XML document with DTD  Read XML document  Document Object Model MB S Sli de 21
  • 22.  MB S To be continued… Document Object Model Sli de 22
  • 23. MB S XML How to program  http://www.w3.org  XML tutorial http://www.w3schools.com/w3c/  Document Object Model Sli de 23
  • 24. MB S Feel free to post questions at http://yht4ever.blogspot.com  or email to: [email protected] or [email protected]  Document Object Model Sli de 24