Wednesday, April 05, 2006

Document Object Model (DOM) and DHTML Object Model

The W3C Document Object Model (DOM) is a platform and language independent interface that will allow programs and script's to dynamically access and update the content, structure and style of documents. The document can be further processed and the results of that processing can be incorporated back into the presented page. The Document Object Model provides a standard set of objects for representing HTML and XML documents, & a standard model of how these objects can be combined & a standard interface for accessing & manipulating them.

The goal of the DOM group is to define a programmatic interface for XML and HTML. The DOM is separated into three parts : Core, HTML, and XML. The Core DOM provides a low-level set of objects that can represent any structured document. While by itself this interface is capable of representing any HTML or XML document, the core interface is a compact and minimal design for manipulating the document's contents. Depending upon the DOM's usage, the core DOM interface may not be convenient or appropriate for all users. The HTML and XML specifications provide additional, higher-level interfaces that are used with the core specification to provide a more convenient view into the document. These specifications consist of objects and methods that provide easier and more direct access into the specific types of documents.

The power of the DOM stems from its position as a standard of the World Wide Web Consortium (W3C). This position ensures that most browsers and platforms will Support it eventually. The development of DOM aligns with the trend to provide more interactive content on the web. The only way to provide this interactive content is by allowing HTML to be dynamically manipulated. The DOM makes this challenge much more easier.

DOM is being designed at several levels:
Level 1. This concentrates on the actual core, HTML, and XML document models. It contains functionality for document navigation and manipulation.
Level 2. Includes a style sheet object model, and defines functionality for manipulating the style information attached to a document. It also enables traversals on the document, defines an event model and provides support for XML namespaces.
Level 3. Will address document loading and saving, as well as content models (such as DTDs and schemas) with document validation support. In addition, it will also address document views and formatting, key events and event groups.
Further Levels. These may specify some interface with the possibly underlying window system, including some ways to prompt the user. They may also contain a query language interface, and address multithreading and synchronization, security, and repository.

The Document Object Model has been evolved from DHTML Object Model. The DHTML Object Model let's us to access & update HTML objects individually. Each HTML tag can be accessed & manipulated through it's ID & NAME attributes. Each object will be having its own properties, methods & events. We can use the properties to read & update local attributes of the object. We can use the methods to manipulate the objects & take advantage of the events to trigger pre- defined consequences.

The Document Object Model is much more general than the DHTML object model. It provides a model for the whole document, not just for single HTML tag. The Document Object Model represents a document as a tree. Every node of the tree represents an HTML tag or a textual entry inside an HTML tag. The tree Structure accurately describes the whole HTML document, including relationships between tags and textual entries on the page. A relationship may be of the type child, parent or sibling.

We need to manually access & update a HTML page with the DHTML Object Model. Because, each tags object includes different properties, methods & events. We don’t have to manually access & update an HTML page with DOM. When looking at HTML code we can figure out what the tree model of the page looks like & how to navigate to the properties we need

1 Comment:

Anonymous said...

thanks prasanna. I was searching for the info regarding DOM. I got a good knowledge regarding DOM after reading your article. keep up the good work...