11.2 Multiple Windows and Explicit Window References

The difficulty with an implicit window reference is that most web browsers, including Navigator, allow more than one browser window to be open at a time. Since there can be more than one window, there must be more than one Window object, but the implicit window reference can only refer to one of them. Logically, the implicit reference is a reference to the current window--the window that is displaying the HTML document that contains the JavaScript code being executed.

If you want use the properties or methods of a Window object other than the current, implicit, window, you must obtain an explicit reference to it. In general, the only way to obtain an explicit reference to another Window object is to create that Window (and the browser window it represents) yourself. You open a new browser window, and create the Window object that represents it with the open() method of the Window object. You might use it like this. (Note that we access it through the window property of the implicit Window object to make more clear what it is we are opening.)

var newwin =index.html window.open("sitemap.html", "site_map_window");

The most important feature of the open() method is the value it returns. This is the explicit reference to the new Window object that we need. In the line of code above, we store this reference in a variable named newwin. (Note the difference between the name of the variable that contains a reference to the window and the name of the window itself.) With this explicit reference to the new Window object, we can use properties and methods of the new window. For example, to set the text in the new window's status line, we could do this:

newwin.defaultStatus =index.html "Site Map. Click map for details.";

The code shown above is intended to run in the original window, and use the newwin variable defined in that window to refer explicitly to the newly created window. Any code in the new window (i.e., JavaScript that is part of the sitemap.html document displayed in that window) can of course refer to that new window with an implicit reference--for that code, the new window is the "current" window. This raises the question of how code in the new window can refer to the original window, in order to use properties and methods of that Window object. Once again, an explicit reference is needed. In this case, the original window can provide that explicit reference for the use of the new window. The code to do so might look like this:

// Create a new window.
var newwin =index.html window.open("sitemap.html", "site_map_window");
// Set a property in the new window that contains an explicit reference 
// to the original window. There is nothing special about the name "creator";
// we can choose any property name we want.
newwin.creator =index.html self;

// Code in the new window. Note that we refer to the creator property 
// of the new window using the implicit window reference for that window.
creator.alert("Hello old window, this is the new window!");

We've seen how we can use the Window.open() method to create a new browser window and obtain an explicit reference to it. The open() method also allows us to obtain an explicit reference to windows that already exist, if we know the name of that window. We mean here the name of the window itself, of course, not the name of a variable that refers to the window. This is the name specified by the second argument to Window.open(). In the examples above, we've used the name "site_map_window". So, if we know that a window by this name already exists, but we do not have a variable or a property that refers to the Window object for that window, then we can obtain such a reference like this:

// Return a reference to a named window that already exists, or, if it
// doesn't actually exist, then create a window with this name.
site_map =index.html window.open("", "site_map_window");

window.close(site_map);

window.close(self);