Output
One of the most import features of any language is getting text to output. Output can be defined as text on the user's screen or the status bar, or can be outputted to a file. Regardless, it is a basic feature of most programming languages. In JavaScript, output can be directed to the current document window and on the user 's screen via pop-up dialog boxes.
Current Document Window
Two popular methods of outputting text to the current document window are the write() and writeln () methods. These methods were used in most of the examples for this chapter. The write() method writes the assigned text as defined inside its parentheses, or the argument, to the document object's current window. In the following example, the write() method sends its argument to the current document's window:
document.write("Writing "ABC..." to the current document's window!");
The writeln() method gives the output a new twist by adding a new line after the output. Inside the write() method, you can include tags and special characters that enhance how the text is output to the object. Table 16.12 outlines the tags and special characters to be used with the write() method.
Table 16.12. write() Tag Characters
| Character | Description | Command Example |
|---|---|---|
| Adds a new line | document.write("\n Adds a New Line! "); | |
| Adds a tab | document.write("\t Adds a Tab! "); | |
| Adds a carriage return | document.write("\r Adds a Carriage Return! "); | |
| f | Adds a form feed | document.write("\f Adds a form feed!f"); |
| Adds a backspace | document.write("\b Adds a backspace!"); | |
| Makes the text bold | document.write(" Makes text bold!<>"); | |
| Forces a new line | document.write(" Forces a new line! "); |
|
| Forces a paragraph | document.write(" Forces a new paragraph!
"); |
Actually, most HTML tags can be used inside the write() method. You'll also notice that a backslash is used to escape out the character so that it can be output. To get command literals to output in this way, use the backslash to escape the command. To output a literal backslash, use two of them together, as in \ . If you use an HTML tag that requires the use of double quotes, you can use single quotes to set the write() method's argument:
document.write('
The SRC tag requires double quotes to be used. Therefore, the single quotes are used to set the write() method's argument.
Dialog Boxes and Prompts
One of the best ways to communicate with the user in the user interface is through dialog boxes and prompts. These are very helpful when you need to generate text that pops up in small dialog boxes, separate from the current document's window, or to interact with the user.
The alert() Method
One of the easiest ways to accomplish this in JavaScript is to use the alert() method. The alert() method displays the text argument in a dialog box touting an OK button. Depending on the user's platform, alert() halts script processing until the alert() 's OK button is selected by the user as shown in Figure 16.12. In UNIX, the script continues to process regardless of whether the user selected alert 's OK button. The syntax in which to use alert() is this:
alert("Thank you! Your document has been submitted");
Figure 16.12. The alert dialog box in the browser.
All the special characters and HTML tags that are used with the write() method can also be used with the alert() method.
The prompt() Method
The prompt() method allows you to interact with the user by capturing data entered. This is similar to the input method in LotusScript or @Prompt in @Functions. The prompt() method creates a dialog box with an entry field and allows for a default value. The syntax is as follows :
Prompt("Would you like to purchase a JavaScriptZone Tee-Shirt?","Yes");
The prompt() method also returns the user's input and can be stored in a variable. Here's how you might use the prompt() method:
Document.write("Purchase Tee-Shirt: ");
document.writeln("prompt("Would you like to purchase a JavaScript Zone Tee-Shirt?",
Figure 16.13 shows how this code looks on a Web page when it is evaluated.
Figure 16.13. The prompt() dialog box in the browser.
The result looks like Figure 16.14 if the user selects the default answer of Yes to the question.
Figure 16.14. After the prompt() is processed in the browser.
To recap, use prompt() to capture user input and use alert() to display a message to the user.