Overview of JavaScript Objects

By: aathishankaran in Javascript Tutorials on 2007-03-21

When you begin to look closely at the JavaScript object hierarchy you can see that each object falls into one of two categories: Navigator objects and built-in language objects. This section looks at these sets and introduces you to each of the objects within them.

Navigator Objects

Most of the functionality built into JavaScript centers around what you can do with HTML pages. The first set of objects Navigator objects generally has a correlation to the browser and HTML tags within it.

Window Object

A Web browser-whether it's Netscape Navigator, Microsoft Internet Explorer, or whatever- is presented to the user in a window. Everything a user does with the browser is performed within that window. Moreover, every screen element is also contained inside that window. The window object provides a direct corollary to this metaphor. It is considered the highest-level object of all objects in the JavaScript object hierarchy and contains all other Navigator objects (except for the Navigator object itself). Just as you can have multiple windows open in your browser, you can work with multiple window objects at once in your code.

The window object has no HTML tag equivalent, although you do define its event handlers (onLoad, onUnload) in the <BODY> tag. Within JavaScript code, you work with a window object as shown in the following example. Suppose you wart to add text to the status bar of the window. The code follows:

EXAMPLE for OnLoad and OnUnLoad

<html>
<head>
  <script>
    function ab() {
      alert("The alert is inside user defined javascript function");
    }
  </script>
</head>
<body onLoad="alert('WELCOME')" onUnload="alert('COME AGAIN')">
  <a href="javascript:void(0);" onMouseOver="window.status='User defined function'; return true;" onMouseOut="window.status=''; return true;" onClick="ab()">click</a>
</body>
</html>

Frame Object

As you learn in this book, frames are especially important objects to use to enhance the presentation of your Web application. The frame object represents a frame within a frameset. In a multi-frame presentation, your window object is the page that contains the <FRAMESET>definition, whereas the other pages are considered frames in that context.

Location Object

The Web is all about content presentation. Every window object is designed to display content to the user, but that content must come from somewhere. The origin of the page is thus contained in the location object. The location object is used to store all URL information for a given window. Although users see URL information in the Location box on-screen, you can work with that same information with the location object.

If you want to retrieve the protocol portion of the current URL and evaluate it, you use the following:

function evalProtocol() {
  curProtocol = window.location.protocol
  if (curProtocol == "http:") {
    alert("The document comes from the Web.")
  }
  else {
    if (curProtocol == "file:") {
      alert("This document comes from your hard drive.")
    }
    else {
      alert("This document comes from somewhere else.")
    }
  }
}

Previous
<< Introducing JavaScript.

Next
Built-In JavaScript Objects >>