Output Methods and Streams

write and writeln

The document.write method displays any number of expressions in a document window. Expressions to be printed can be of any type, including numerics, strings, and logicals.

This method prints its arguments to the plain HTML document window. It does not append any external character to the printed arguments. The method document.write, also accessible as window.document.write, can be used from either a plain script (<SCRIPT LANGUAGE="JavaScript">…</SCRIPT>) or from an event handler.

Bear in mind that event handler scripts are executed only after the HTML source has been through layout. The write() method implicitly opens a new document of mimeType text/html if you do not explicitly invoke a document.open() method prior to the document.write() call.

The writeln() method acts exactly like the write() method, except that it appends a new line character to the end of the output. HTML generally ignores this character, but certain tags, such as <PRE>, welcome it:

<PRE>
one
two
three
<PRE>

After interpretation, the Web page appears as:

one
two
three

You can create the same output via JavaScript in the following fashion:

document.write("<PRE>")
document.writeln("one")
document.writeln("two")
document.writeln("three")
document.write("</PRE>")

Data Streams

The document.open() method opens a stream to collect the output of write() and writeln() methods. Its general syntax is:

document.open(["mimeType"])

mimeType specifies the type of document which is one of the following:

text/html
text/plain
image/gif
image/jpeg
image/x-bitmap
plugIn

plugIn is any two-part plug-in supported by the user’s browser.

Generally speaking, if the mimeType is text or image, the stream is opened to layout which is generated by instructions from the browser. Otherwise, the stream is opened to a target plug-in which you have to make sure understands the data you provide. Since document is a property of window, document.open() or window.document.open() opens a stream specific to the document in the target window. If a document already exists in the target window, the open method clears it. If you do not specify mimeType as the method’s argument, the most common one, text/html, is assumed. Note that you should never use this method to open a stream in the document which includes the JavaScript method itself. It is always used to open data streams to documents in other windows.

After you complete supplying data to the opened stream, you should close it via the document.close() method. Its syntax is simply the following:

document.close()

This method primarily closes a stream opened with the document.open() method. If not explicitly closed by the script, all font style tag pairs are closed implicitly. For example, if you provide a <BIG> tag but do not provide a closing </BIG> tag later, JavaScript provides it automatically. The close() method also stops the “meteor shower” in the Netscape icon or the rotation of the IE icon, and displays “Document: Done” in the status bar.

The document.close() method is extremely important because it instructs the browser’s interpreter to display the data stream. If you do not invoke it, the output might not have any influence on the content of the page.

Since we have not discussed windows yet, this discussion seems a bit theoretical. We will refer back to these methods later, when the subject of windows will be dealt with in depth.

Another related method is document.clear(). Clearing a document via this method clears all HTML outputs in that document and resets the object model corresponding to that document. Normally, since JavaScript automatically clears the old document when you open a new stream, you don’t have to clear a document prior to its opening or rewriting. The only case in which you should clear a document is after you close the stream to it. Since the method document.clear() is not functioning in many Netscape versions, you can clear a document by opening it, writing a line break to it, and then closing it. Look at the following example:

windowReference.document.open("text/html")
windowReference.document.write("<BR>")
windowReference.document.close()

For some reason, this clearing method requires writing at least one character to the stream. The line break is used here because it is transparent to the user.

Summary

In this chapter we discussed several properties and methods of the document object. We focused on colors, and naturally on hexadecimal triplets that define them. We learned how to script the various document colors such as background color, link color, and so forth. Two interesting examples dealing with colors were also analyzed. We have discussed other properties and methods as well. We have presented the basic output methods, document.write() and document.writeln(), as well as data streams. Data streams and document clearing play an important role in scripting windows and frames, as will be explained later.