|In this chapter you will learn :
- What is Document Object Model.
- The object hierarchy followed in DOM
- Creating objects and accessing object's properties, events and methods.
- Various in-built objects.
When an HTML page is rendered in a browser; the browser brings together all the elements (objects) contained in the HTML page, downloaded from the web server, in its memory. It is important that the browser continues to identify individual HTML objects even after they are rendered in the browser window, if you want to create a user-friendly web page. With the identification of objects, the browser is allowed to access the properties of these objects using the built-in methods of the object. Once the properties of an object are accessible then the utility of the object can be controlled.
The HTML objects, also known as the collection of web page elements, belong to the DOM. These objects have a descending relationship with each other. The foremost object in the DOM is the 'Navigator' (i.e. the Browser) itself (for example, Netscape, Internet explorer, Mozilla etc). The next level in the DOM is the browser's 'Window' or frame. The next object in the DOM is the 'Document' displayed in the browser's window. If the browser's window, next displays HTML form, then the next level in the DOM is the 'Form'.
Properties have values, belonging to objects.
Methods are ways of manipulating and accessing objects.
HTML objects have a number of properties that determine the behavior of that object. Properties determine the state of an object. An object's properties can be referenced as :
For example, if the document object has a property called bgcolor then it can be referred as document.bgcolor. Both object name and property name are case sensitive. An object's property is set dynamically, when building interactive web pages, i.e., value of the property is set only when the object is being used. Thus program code can control the state of the object at run time. Methods of an object are used to set or get a value of an object's property. All objects have methods associated with them. An object's methods can be referenced as :
| Object Name
|| Its use
||To access information about the browser and its version that is currently executing the script.
||It is a predefined object and does not require the prefix 'window'. It allows you to access a browser 'window' or a frame within a window.
||To access the document currently loaded in a window. It has properties that relate to the current HTML document, such as title, name of a form, links, background color etc.
||It represents a URL based on the current document location. It can be used to create a URL object, access parts of a URL, or modify an existing URL.
||To maintain a history of the URLs previously accessed within a window.