[Chapter 11] 11.3 Windows and Frames
Author: David Flanagan
Date: Fri Aug 29 10:58:13 1997

#

| Chapter 11 Windows and the JavaScript Name Space |

## 11.3 Windows and Frames

While Navigator (and other browsers) can display multiple HTML pages in multiple browser windows, it can also display multiple pages within a single window by using frames--a feature that allows a single browser window to be divided horizontally or vertically (or both) into individual sections that each display a separate HTML document. Although frames are not strictly windows in their own right, they behave like windows in many ways, and in JavaScript, each frame is represented with a Window object. Thus the Window class can represent both top-level browser windows and frames within a browser window (and frames within other frames, of course).

Each Window object has a `frames[]` array property that contains references to each of the frames (if any) that the window contains. The `frames.length` property specifies the number of frames in the array. Also, each Window object has a `parent` property that refers to the window or frame that contains the object (top-level browser windows have their `parent` property set to themselves). Thus, if a browser window contains two frames, and JavaScript code is running in the first frame, that code refers to the first frame implicitly or with the `self` or `window` properties. To refer to the second frame, that code could use the expression `parent.frames[1]`.

The `top` property is similar to the `parent` property, but differs for frames that are recursively contained within other frames. The `top` property always contains a reference to the top-level browser window that contains the frame, which, in the recursive frames case, is not the same as the parent of the frame. Figure 11.1 illustrates the relationship between frames and windows, and shows a schematic representation of the `frames[]` array, and the `parent`, `top`, `window`, and `self` properties.

#### Figure 11.1: Browser windows and frames

Top-level windows and frames have a significantly different representation on the screen, so it would seem that they would have a different representation in JavaScript. As we've seen, however, they are both represented by the Window object, and have the same properties and methods. As it turns out, the practical differences between top-level windows and frames really are quite minor:

- For top-level windows, the `parent` and `top` properties are simply references to the window itself; these properties are really useful only when used with frames, or when used to distinguish a frame from a top-level window; you can check for a top-level window with `if (parent == self)`.

- The `alert()`, `confirm()`, and `prompt()` methods pop up dialog boxes. While these methods may be invoked through any Window object, including those that represent frames, the dialog boxes always appear centered over the top-level window, not over individual frames.

- Setting the `status` or `defaultStatus` properties of a top-level window sets the text that appears in the browser status line. When these properties are set for a frame, the status line only displays the specified text when the mouse is over the frame.

Multiple Windows and Explicit Window References |  | Window and Frame Names