1 / 16

Understanding Document Object Model in Web Development

Learn the basics of the Document Object Model, its levels, and the importance of writing well-formed XHTML documents. Explore the linear vs. hierarchical views of the DOM and how to prepare web pages for DOM manipulation.

ewingj
Download Presentation

Understanding Document Object Model in Web Development

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. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Beginning DHTML:Introducing DOM

  2. Goals By the end of this lecture you should … • Understand a basic definition of the Document Object Model (DOM). • Understand the differences in DOM Standard Levels. • Understand the importance of writing well-formed XHTML documents.

  3. What is the DOM? • The Document Object Model (DOM) is a model of programming that concerns the way in which we represent objects contained in a web document (single web page). • There are several different levels of the DOM Standard, as proposed by the W3C.

  4. DOM Standard Levels • Level 0: Not really a standard level. Refers to models developed by browser vendors for handling documents prior to a standard. • Level 1: First recommendation from W3C for a DOM Standard. Includes two parts: a core (covers XML & HTML) and an HTML-only section.

  5. DOM Standard Levels • Level 2: Includes additions for events and style sheets. Supported by current versions of the most popular browsers. • Level 3: Still under development. Includes additions for XML features.

  6. Linear vs. Hierarchical Views • Level 0 of the DOM takes somewhat of a linear view of objects in a web document, forcing the programmer to “drill down” from the window object to relevant properties and methods:strUserName = window.document.frmMain.txtUser.value

  7. Linear vs. Hierarchical Views • Level 1 and subsequent DOM Levels perceive objects using a hierarchical view. Instead of identifying specific HTML tag names, this view works through the idea of nodes in a tree diagram. Each node has the potential to be a parent, sibling,or child node of other nodes in the document. This model may be a little trickier to program, at first, but saves us from having to know the names of all the elements in our document.

  8. Open the file called introDOM_01.htmland examine the XHTML script.

  9. - Adapted from Beginning JavaScript by Paul Wilton

  10. Preparing Your Pages for DOM • All pages must be well-formed XHTML documents. • All pages must include a valid DOCTYPE. • You must include all text inside valid XHTML elements. • Identify relevant elements using the id attribute.

  11. The XHTML id Attribute • id is an XHTML attribute that provides an internal identifier for an XHTML element (tag). • When can use the id attribute to uniquely identify an element in order to read and/or manipulate its contents.

  12. Open the file called introDOM_02.htmland examine the XHTML script.

  13. XHTML Validators • Tidy:http://tidy.sourceforge.net/ • HTML Validator for Firefox:http://users.skynet.be/mgueury/mozilla/ • W3C Markup Validation Service:http://validator.w3.org/

  14. Summary • The DOM is a model of programming concerned with objects in a web document. • While DOM, Level 0 takes a linear approach to document objects, subsequent levels view those objects using a hierarchical scheme. continued …

  15. Summary • To use DOM, XHTML web pages must be well-formed. • All text in well-formed pages must be enclosed in elements. • All relevant elements must include an id attribute and value.

  16. Resources • Beginning JavaScript, 2nd Edition. Paul Wilson. Wiley Publishing, 2004. (ISBN: 0-7645-5587-1)

More Related