N00Blog

The HTML Document object model is a w3 standard for accessing and working with HTML. It provides a hierarchial, tree like structure, where “objects” within the document contain attributes, and even other objects. Using scripts, these “parent nodes” (higher level objects), and their “child nodes” (contained objects) can be viewed and altered according to the author’s will, and user inputs. To view or alter these elements, “GetElementById” may be used in Javascript eg:

document.GetElementById(“Div1″).innerHTML = “this text”

would select the element with the id “Div1″ and change the text it contains to “this text”. Following this, exclusive to IE, DOM, enables the use of document..all”Div1″) to select all of the objects below “Div1″ in the heirarchy.

Events can be used within scripts in objects, to provide user interactivity, and to access other elements of the DOM. Events such as OnKeyPress, and OnKeyDown allow such events (as user presses keys) to run scripts within the HTML. The difference between OnKeyPress and OnKeyDown, is that while OnKeyPress will trigger an event repeatedly as long as the key is held down, OnKeyDown will trigger only on the initial keypress.

Event Bubbling is a function performed within the DOM process, which occurs when events are triggered by the user. If an event is triggered by an element, but no associated process is included within the object, the event is shifted up the DOM heirarchy in a ‘bubbling’ process, until it reaches an element which can process the event.

Source:

MSDN: About the DHTML Object Model