Each object has its own properties, methods, and events. With the help of these properties, methods, and events, the objects can be used to make a Web page or Web site interactive.

Now, you will see how to use the properties, methods, and events of an object by taking the example of the window object.

The window object consists of different properties, methods, and events that can be used as follows:
change the content of the window.
open a new window.
create and access frames in a multiframe window.
work with forms, etc.
The following table displays the properties, methods, and events of the window object:


Properties
Methods
Events
closed
alert()
onblur
defaultStatus
back()
ondragdrop
document
blur()
onfocus
frames []
captureEvents()
onload
history
clearInterval()
onmove
innerHeight
clearTimeout()
onresize
innerWidth
close()
onunload
location
confirm()
 
locationbar
disableExternalCapture()
 
menubar
enableExternalCapture()
 
name
find()
 
onerror
handleEvent()
 
opener
forward()
 
outerHeight
home()
 
outerWidth
moveBy()
 
pageXOffset
moveTo()
 
pageYOffset
focus()
 
parent
open()
 
personalbar
print()
 
scrollbars
prompt()
 
self
releaseEvents()
 
status
resizeBy()
 
statusbar
resizeTo()
 
toolbar
routeEvent()
 
top
scroll()
 
window
scrollBy()
 
 
scrollTo()
 
 
setInterval()
 
 
setTimeout()
 
 
stop()
 

The closed property

The closed property is used to check whether the child window is closed or not. This property returns a boolean value. It returns true if the window is closed.

var nwind=null
function op()
{
               nwind=window.open("","hello")
               if(nwind.closed==true)
               {
                nwind=window.open("","hello")
               }
}
function cld()
{
                if(nwind.closed==false)
               {
               nwind.close()
               }
}

The defaultStatus property

This defaultStatus property is used to put a default text at the statusbar of the browser window. If the mouse pointer moves over a link, the status bar text changes to the path of the URL. On removing the mouse pointer, the text changes back to the default text.

function defstat()
{
               window.defaultStatus="It is my program"
}

The document property

The document property is related to the content area of the window. It is used to access the objects that are contained in it. For example, a form and its elements.

The frames property

The frames property is an array of frames. In a multiframe window, this property is used to access a frame according to its number in the window.

If a window contains two frames, their index value will be 0 and 1.

Following is the syntax to access the frames:

top.frames[0]
parent.frames[0]

The history property

The history property of the window object is the history object. The browser maintains the list of all the URLs that are accessed during the surfing of the Internet. In JavaScript, this list is maintained by the history object. A script can methodically navigate to each URL in the history by a relative number or by stepping back one URL at a time.

The innerHeight and innerWidth properties

The innerHeight and innerWidth properties are related to the dimensions of the content area of the window. These properties are used to set or get the width and height of the content area of the document.

The location property

The location property represents the location of the URL of the currently open window or of a specific frame. A multiframe window displays the URL of the topmost window in the location field. To get the URL of a frame, the user should use the frame reference before the location object. For example:

parent.framename.location

The locationbar property

The locationbar property refers to the addressbar where the URL of the current window is displayed. In Internet Explorer, it is called the addressbar and the property used is location, not locationbar. The locationbar is the property of the Netscape browser.

The menubar property

The menubar property refers to the menubar of the browser window.

The personalbar property

The personalbar property refers to the personal bar in the Netscape browser. The personalbar is known as directories in the Internet Explorer.

The scrollbars property

The scrollbars property refers to the horizontal and the vertical scrollbars of the browser window.

The statusbar property

The statusbar property is used to display the statusbar of the browser window. In the Netscape browser, the property is called statusbar, and in Internet Explorer, it is called status.

The toolbar property

The toolbar property is used to display the standard toolbar of the browser window.

The opener property

When a new window is created from the original window, the new window can access the properties and functions of the original window by the opener property.

The syntax of using the opener property is as follows:

opener.propertyname
opener.functionname

The outerHeight and outerWidth properties

The outerHeight and outerWidth properties are related to the dimensions of the browser window. These properties are used to get or set the width and height of the browser window.

The pageXOffset and pageYOffset properties

The pageXOffset and pageYOffset properties refer to the coordinate system of the content area of the browser window. The pageXOffset refers to the x-position and the pageYOffset refers to the y-position corner of the content area.

The parent property

The parent property is used to access the property of the parent frame from a child frame. If a window contains a frameset, the browser window is the parent of the frame. If the child frameset contains another frameset, this means that the window consists of three generations.

The following is the syntax:

parent.propertyname

The self property

The self property refers to the current window or frame that contains the object. It can be used to access the property of the same window or frame.

The following is the syntax:

self.propertyname

The status property

The status property is used to write some text in the statusbar of the browser window. This property displays the URL of the Web page that is being loaded in the browser window.

The syntax is as follows:

window.status="The string"

The top property

The top property refers to the topmost window in a multiframe window. It is the first window that defines the first frameset. It is the parent of all frames and all the frames can access the properties of the topmost window by using the top property.

For example:

top.propertyname

The window property

The window property refers to the same window object.

The alert() method

The alert method is used to display a warning message for the user if he has made any mistake. For example, in form validation, the user can be warned for entering wrong data in a field

The syntax of using the alert method is as follows:

alert("string")

The back() and forward() methods

The back method is used to move to the previous page from the current page. It has the same function as the back navigation button in the standard toolbar of the browser. The back method works only in the Netscape browser.

window.back()

The forward method is used to move to the next page from the current page. It has the same function as the forward navigation button in the standard toolbar of the browser. The back method works only in Netscape browser.

window.forward()

The blur() method

When the blur method is invoked, the current window loses the focus.

window.blur()

The captureEvents() method

The captureEvents method takes one or more event types as parameter. The event type that is captured by the window object triggers the function invoked on that event handler.

The syntax of using the captureEvents function is as follows:

window.captureEvents(event_type_list)

The clearInterval() and setInterval() methods

The setInterval method is used to execute an expression with a fixed number of time delay between the call to that expression.

The syntax is as follows:

window.setInterval("function_name",delay)

The clearInterval is used to turn off the loop started by the setInterval method.

The syntax is as follows:

window.clearInterval(intervalId)

The clearTimeout() and setTimeout() methods

The setTimeout method is used to set a certain amount of time for a function to be executed.

The syntax is as follows:

window.setTimeout("function_name",delay)

The clearTimeout method is used to cancel the timer that is set by the clearTimeout method.

The syntax is as follows:

window.clearTimeout(intervalId)

The close() and open() methods

The open method is used to open a window from the main window.

The syntax is as follows:

window.open("URL", "window_name","window_features")

The close method is used to close the window that is opened by the open method.

The syntax is as follows:

window.close()

The confirm() method

The confirm method is used to present a message in a modal dialog box along with the OK and cancel buttons. This dialog box can be used to ask a question to the user about the actions, which, if performed, will not be undoable.

The syntax is as follows:

confirm("message")

The find() method

The find method is used to search a text string within a document.

The syntax is as follows:

window.find("searchstring",matchcase)

The focus() method

The focus method is used to focus a window from a different window.

The syntax is as follows:

window.focus

The moveBy() and moveTo() methods

The moveBy and moveTo methods are used to adjust the position of the window on the screen.

The syntax is as follows:

window.moveBy(x,y)
window.moveTo(x,y)

The print() method

The print method is used to print the hard copy of the contents present in the browser. The print method works in the same way as the print button on the standard toolbar of the browser.

The syntax is as follows:

window.print()

The prompt() method

The prompt method is used to open a dialog box that includes a message from the script author, a field for user entry, and the OK and Cancel bottoms. The script writer can supply a prewritten answer so a user can press the OK button when he is confronted with it.

The syntax is as follows:

prompt("text",defaultValue)

The resizeBy() and resizeTo() methods

The resizeBy and resizeTo methods are used to resize the browser window. The resizeBy method adjusts the window relative to the screen while the resizeTo method resizes the window with absolute position.

The syntax is as follows:

window.reiszeBy(x,y)
window.reiszeTo(x,y)

The scroll, scrollBy, and scrollTo methods

All the three methods are used to navigate within the content of the browser window.

The scroll method scrolls the window according to the coordinates supplied. This method is now deprecated and the scrollTo method is used in its place

The scrollBy method scrolls the window according to the pixels specified.

The scrollTo method scrolls the window according to the coordinates supplied.

The syntax for these methods is as follows:

scroll(x,y)
scrollBy(x,y)
scrollTo(x,y)

The onblur Event Handler

The onblur event handler is fired when a window loses focus.

The onfocus event handler

The onfocus event handler is fired when a window gets the focus.

The ondragdrop event handler

The ondragdrop event handler is fired when a dragdrop occurs on the browser.

The onload Event Handler

The onload event handler is fired when the full document has been loaded on the window.

The onmove event handler

The onmove event handler is fired when a window is moved around the screen.

The onresize event handler

The onresize event handler is fired when the browser window is resized.

The onunload event handler

The onunload event handler is fired when a document is unloaded from a window.