Working with Windows: Writing Content to a Window | WebReference

Working with Windows: Writing Content to a Window


Working with Windows

Writing Content to a Window

The window.open() method opens a new window, while the document.open() method opens a document to collect the output of write() or writeln() methods. Its general syntax is:

oNewDoc = document.open(sMimeType[, sReplace]);

sMimeType is a string that specifies the MIME type. Navigator supports several different MIME types, but Internet Explorer currently only supports "text/html". The second argument is a string that specifies whether the new document being written is to replace the current document in the History list. Otherwise, by default, the document being created does not replace the current document in the History list. The sMimeType parameter is optional. If you want the new document to replace the current one in the History list, you should supply the string "replace".

"replace" is typically used on a window that has a blank document or an "about:blank" URL. After "replace" is specified, the write() method typically generates HTML for the window, replacing the history entry for the blank URL. Take care when using generated HTML on a window with a blank URL. If you do not specify "replace", the generated HTML has its own history entry, and the user can press the Back button and back up until the frame is empty.

Take a look at the following script segment:

var oNewDoc = document.open("text/html", "replace");
var sMarkup = "<HTML><HEAD><TITLE>New Document</TITLE></HEAD>";
sMarkup += "<BODY>Hello, world!<BR><A HREF='write.html'>Return</A></BODY></HTML>";
oNewDoc.write(sMarkup);
oNewDoc.close();

Click the following button to run this script:

"; oNewDoc.write(sMarkup); oNewDoc.close(); } // -->

As you can see, we've included a link in the new document so that you can return to this page. If you click the browser's Back button, the browser returns to the page before this one. Since we're using the "replace" argument, the new document (the one being written) replaces the current document in the history list, so clicking Back doesn't return to the current page (the one containing the script). The following button runs the same script, without the "replace" argument, so you can return to this page by clicking the browser's Back button:

"; oNewDoc.write(sMarkup); oNewDoc.close(); } // -->

As you can see in both of these examples, the last statement closes the output stream:

oNewDoc.close();

In general, the document.close() method closes an output stream, and forces the sent data to display.

Writing to a New Window

Take a look at the following script:

var win = window.open("", "win", "width=300,height=200"); // a window object
win.document.open("text/html", "replace");
win.document.write("<HTML><HEAD><TITLE>New Document</TITLE></HEAD><BODY>Hello, world!</BODY></HTML>");
win.document.close();

The first statement opens a new window with an empty document (""). The returned value is assigned to a variable named win. We then use the new window's document object, win.document, to write some HTML to the new window. The "replace" specification is necessary, because we don't want the blank page to have an entry in the History list.

Since we're dealing with the same document object, we might as well assign it to another variable:

var win = window.open("", "win", "width=300,height=200"); // a window object
var doc = win.document;
doc.open("text/html", "replace");
doc.write("<HTML><HEAD><TITLE>New Document</TITLE></HEAD><BODY>Hello, world!</BODY></HTML>");
doc.close();

We can also use the with statement:

var win = window.open("", "win", "width=300,height=200"); // a window object
with (win.document) {
  open("text/html", "replace");
  write("<HTML><HEAD><TITLE>New Document</TITLE></HEAD><BODY>Hello, world!</BODY></HTML>");
  close();
}

Click the following button to run the script: