Presentation is loading. Please wait.

Presentation is loading. Please wait.

DOM Document Object Model.

Similar presentations


Presentation on theme: "DOM Document Object Model."— Presentation transcript:

1 DOM Document Object Model

2 The Document Object Model
DOM is language independent It is platform independent It is the API for HTML, XHTML and XML Dom always loads the whole document into a tree (can be a problem with very large documents)

3 3 Levels of DOM There are three levels of DOM specification
Level 1: manipulation and navigation of HTML and XML documents Level 2: includes methods for stylesheets and manipulating style objects Level 3: addresses loading and saving DTDs and Schemas

4 Nodes Any part of a document—elements, attributes, comments, processing instructions, text—is considered a node Nodes form a document tree.

5 Sample XML <?xml version="1.0" encoding="UTF-8" ?> <employees> <employee enum="34567"> <name> <lastname>Smith</lastname> <firstname>Alice</firstname> </name> <status dept="accounting" paytype="salary"/> </employee> </employees>

6 Node Tree lastname Smith name firstname Alice employees employee
Accounting dept status paytype Salary

7 Node properties attributes Returns all attributes of a node childNodes
Returns all child nodes of a node firstChild Returns the first child of a node lastChild Returns the last child of a node nextSibling Returns the next sibling (nodes that share the same parent are siblings) nodeName Returns the node name nodeType Returns the node type as a number nodeValue Returns the value of a node parentNode Returns the parent of a node previousSibling Returns previous sibling ownerDocument Returns owner document of a node

8 Node Methods appendChild(newchild) Appends a new child node
cloneNode(boolean) Returns an exact copy of the node. If boolean set to true also copies child nodes hasChildNodes() Returns true if there are child nodes insertBefore(newNode, refNode) Inserts a new node before the reference node removeChild(nodeName) Removes a child node replaceChild(newNode, oldNode) Replaces a child node with a new child node

9 Node Types Element Attribute Text CDATA Section Entity Reference
Processing instruction Comment Document Document type Document fragment notation


Download ppt "DOM Document Object Model."

Similar presentations


Ads by Google