Referencing Windows in JavaScript

By: aathishankaran in JavaScript Tutorials on 2007-03-29

When working with single and multiple frames in your JavaScript application, you probably need to use additional ways to reference windows. JavaScript provides four references to windows. Each of the references are implemented as properties of the window object.

Window and self

User can refer to the current window as window or self. For example, the following two code lines are functionally the same:

window.defaultStatus = "Welcome to the Goat Farm Home Page"
self.defaultStatus = "Welcome to the Goat Farm Home Page"

Because both window and self are synonyms to the current window, you might find it curious that both are included in the JavaScript language. As shown in the previous example, the rationale is simply flexibility; you can use window or self as you want.

However, as useful as window and self can be, it can easily become confusing to think about the logic behind it all. After all, an object's property that is used as an equivalent term for the object itself is rather unusual. Consequently, you might find it helpful to think of window or self as "reserved words" for the window object rather than its properties.

Because window and self are properties of the window object, you cannot use both window and self in the same context. For example, the following code does not work as desired:

window.self.document.write("< hl >Test. </hl >")

Finally, in multiframe environments, window and self always refer to the window in which the JavaScript code is executed.

Parent Frames are the same as window objects within a frameset. Within this multi-frame setting, you need to distinguish between the various frames displayed in the browser. The parent property of a window object helps you do that by referencing it's parent-the window containing the <FRAMESET> definition. For example, if you want to retrieve some information about the current window's parent, you use the following example in Listing.

<html>

<head>
  <title>Child Window</title>
</head>
<SCRIPT >
 function getParentInfo() {
    myParentTitle = parent.document.title
    alert("My daddy's name is " + myParentTitle)
  }

</SCRIPT>
    <form>
      <input type="button" value="Get Info" onClick="getParentInfo () ">
    </form>
</body>
</html>

Previous
<< Math in JavaScript

Next
Handling String in JavaScript >>