Working with the document object model
Download
1 / 36

WORKING WITH THE DOCUMENT OBJECT MODEL - PowerPoint PPT Presentation


  • 91 Views
  • Uploaded on

TUTORIAL 10A. WORKING WITH THE DOCUMENT OBJECT MODEL. THE W3C DOM. To modify an XML or XSLT document, you need to be able to access the document and its contents.

loader
I am the owner, or an agent authorized to act on behalf of the owner, of the copyrighted work described.
capcha
Download Presentation

PowerPoint Slideshow about 'WORKING WITH THE DOCUMENT OBJECT MODEL' - skah


An Image/Link below is provided (as is) to download presentation

Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author.While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server.


- - - - - - - - - - - - - - - - - - - - - - - - - - E N D - - - - - - - - - - - - - - - - - - - - - - - - - -
Presentation Transcript
Working with the document object model

TUTORIAL 10A

WORKING WITH THE DOCUMENT OBJECT MODEL

New Perspectives on XML, 2nd Edition Tutorial 10A


The w3c dom
THE W3C DOM

  • To modify an XML or XSLT document, you need to be able to access the document and its contents.

  • This is done through a Document Object Model or DOM, which is a systematic framework for working with the content and structure of a document.

New Perspectives on XML, 2nd Edition Tutorial 10A


Dom levels
DOM LEVELS

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a cross browser solution
CREATING A CROSS-BROWSER SOLUTION

  • Because there are some fundamental differences between Internet Explorer and the Mozilla-based browsers in implementing the Document Object Model, any program code that you write has to first determine which browser is in use.

    • Object-detection

      var IE = window.ActiveXObject ? true:false;

      var MOZ = document.implementation.createDocument ? true:false;

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a cross browser solution1
CREATING A CROSS-BROWSER SOLUTION

if (IE) {

Internet Explorer code

} else if (MOZ) {

Mozilla code

}

New Perspectives on XML, 2nd Edition Tutorial 10A


Practice
Practice

  • P. 569

  • P. 570-571

  • P. 574-575

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a document object in internet explorer
CREATING A DOCUMENT OBJECT IN INTERNET EXPLORER

  • A document object is an object that can store the contents and structure of a document.

    docObj = new ActiveXObject(PID);

    Where docObj is the variable name of the document object and PID is the program ID that indicates the type of document object to be created.

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a document object in mozilla
CREATING A DOCUMENT OBJECT IN MOZILLA

docObj = document.implementation.createDocument(uri,root,doctype);

Where uri is the URI of the document’s namespace, root is the qualified name of the document’s root element, and doctype is the type of document to create

New Perspectives on XML, 2nd Edition Tutorial 10A


Practice1
Practice

  • P. 576-577

  • P. 578-579

New Perspectives on XML, 2nd Edition Tutorial 10A


Loading a file into a document object
LOADING A FILE INTO A DOCUMENT OBJECT

  • An asynchronous load does not require the application loading the file to wait for it to finish loading before proceeding through the lines in the program code

  • A synchronous load causes the application to stop until the file is completely loaded.

    docObj.async=false;

    Where docObj is the document object into which you want to load the file

New Perspectives on XML, 2nd Edition Tutorial 10A


Loading a style sheet object
LOADING A STYLE SHEET OBJECT

  • Because XSLT style sheets are also XML documents, you need to create a document object using ActiveX

    • Rental-threaded model

    • Free-threaded model

      var FreeThreadPID = ["Msxml2.FreeThreadedDOMDocument.5.0",

      "Msxml2.FreeThreadedDOMDocument.4.0",

      "Msxml2.FreeThreadedDOMDocument.3.0"];

New Perspectives on XML, 2nd Edition Tutorial 10A


Transforming a document
TRANSFORMING A DOCUMENT

  • The transformNode() method creates a text string containing the code of the result document and has the following syntax:

    docObj.transformNode(styleObj)

    resultStr = XMLdoc.transformNode(XSLTdoc);

    docObj.transformNodeToObject(styleObj, resultObj)

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a template object
CREATING A TEMPLATE OBJECT

  • For a large and complicated style sheet or for programs that need to run several transformations, Microsoft suggests storing the compiled style sheet in a template object, which increases the efficiency of the program because the cached style sheet can be accessed repeatedly without being recompiled

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a template object1
CREATING A TEMPLATE OBJECT

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a processor object
CREATING A PROCESSOR OBJECT

  • To create and use a processor object, you follow four steps:

    • Insert a free-threaded style sheet into the template object.

    • Create an XLST processor based on the template.

    • Specify an input source document for the processor.

    • Transform the source document based on the style sheet.

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a processor object1
CREATING A PROCESSOR OBJECT

New Perspectives on XML, 2nd Edition Tutorial 10A


Results of the transformation
RESULTS OF THE TRANSFORMATION

New Perspectives on XML, 2nd Edition Tutorial 10A


Practice2
Practice

  • P. 580

  • P. 581-582

  • P. 583-584

  • P. 585

  • P. 586-587

New Perspectives on XML, 2nd Edition Tutorial 10A


Transforming a document with mozilla
TRANSFORMING A DOCUMENT WITH MOZILLA

New Perspectives on XML, 2nd Edition Tutorial 10A


Transforming a document with mozilla1
TRANSFORMING A DOCUMENT WITH MOZILLA

New Perspectives on XML, 2nd Edition Tutorial 10A


Converting a document object or fragment to a text string
CONVERTING A DOCUMENT OBJECT OR FRAGMENT TO A TEXT STRING

  • To convert a document object or a fragment to a text string in Mozilla, you create a serializer object, which contains a textual representation of the contents of a document object or fragment

    serialObj = new XMLSerializer();

    Where serialObj is the serializer object that will contain the text of the document object or fragment.

New Perspectives on XML, 2nd Edition Tutorial 10A


Converting a document object or fragment to a text string1
CONVERTING A DOCUMENT OBJECT OR FRAGMENT TO A TEXT STRING

New Perspectives on XML, 2nd Edition Tutorial 10A


Practice3
Practice

  • P. 588

  • P. 589

  • P. 591

New Perspectives on XML, 2nd Edition Tutorial 10A


Working with the document object
WORKING WITH THE DOCUMENT OBJECT

New Perspectives on XML, 2nd Edition Tutorial 10A


Working with the document object1
WORKING WITH THE DOCUMENT OBJECT

New Perspectives on XML, 2nd Edition Tutorial 10A


Viewing the node tree
VIEWING THE NODE TREE

  • A node that contains other nodes is a parent node, and the

  • nodes it contains are child nodes.

  • Nodes that share the same parent are sibling nodes.

  • Nodes can contain different types of content. For example, element nodes refer to elements from the Document Object Model, and text nodes refer to the actual text content of element nodes.

  • Attribute nodes refer to the attributes contained within elements or processing instructions.

New Perspectives on XML, 2nd Edition Tutorial 10A


Accessing elements by tag name
ACCESSING ELEMENTS BY TAG NAME

docObj.getElementsByTagName(tag)

Where docObj is the document object and tag is the element’s tag name.

Example:XMLdoc.getElementsByTagName("person")

New Perspectives on XML, 2nd Edition Tutorial 10A


Using familial relations
USING FAMILIAL RELATIONS

  • Each node in a node tree can also be treated as a node object with its own collection of properties and methods

    nodeObj.firstChild

    Where nodeObj is a node from the document’s node tree.

New Perspectives on XML, 2nd Edition Tutorial 10A


Using familial relations1
USING FAMILIAL RELATIONS

New Perspectives on XML, 2nd Edition Tutorial 10A


Node types names and values
NODE TYPES, NAMES, AND VALUES

  • nodeObj.nodeType

  • nodeObj.nodeName

  • nodeObj.nodeValue

New Perspectives on XML, 2nd Edition Tutorial 10A


Adding and removing nodes
ADDING AND REMOVING NODES

nodeObj = docObj.createElement(tag);

Where nodeObj is the new element node, docObj is the document object containing the new node, and tag is the tag name associated with the element

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating node objects
CREATING NODE OBJECTS

New Perspectives on XML, 2nd Edition Tutorial 10A


Inserting and removing nodes
INSERTING AND REMOVING NODES

New Perspectives on XML, 2nd Edition Tutorial 10A


Creating a document fragment
CREATING A DOCUMENT FRAGMENT

New Perspectives on XML, 2nd Edition Tutorial 10A


Cloning a document fragment
CLONING A DOCUMENT FRAGMENT

New Perspectives on XML, 2nd Edition Tutorial 10A


Practice4
Practice

  • P. 603

  • P. 604-605

  • P. 605-606

New Perspectives on XML, 2nd Edition Tutorial 10A