Online Book Reader

Home Category

HTML, XHTML and CSS All-In-One for Dummies - Andy Harris [133]

By Root 1299 0
a small dialog box containing text for the user to read. The alert box is an example of a modal dialog. Modal dialogs interrupt the flow of the program until the user pays attention to them. Nothing else will happen in the program until the user acknowledges the dialog by clicking the OK button. The user can’t interact with the page until he clicks the button.

Modal dialogs may seem a bit rude. In fact, you probably won’t use them much once you discover other input and output techniques. The fact that the dialog box demands attention makes it a very easy tool to use when you start programming. I use it (and one of its cousins) throughout this chapter because it’s easy to understand and use.


Adding the semicolon

Each command in JavaScript ends with a semicolon (;) character. The semicolon in most computer languages acts like the period in English. It indicates the end of a logical thought. Usually, each line of code is also one line in the editor.

To tell the truth, JavaScript will usually work fine if you leave out the semi-colons. However, you should add them anyway because they help clarify your meaning. Besides, most other languages, including PHP (see Book V), require semicolons. You may as well start a good habit now.


Introducing Variables

Computer programs get their power by working with information. Figure 1-2 shows a program that gets user data from the user to include in a customized greeting.

Figure 1-2: First, the program asks the user for her name.

This program introduces a new kind of dialog that allows the user to enter some data. The information is stored in the program for later use. After the user enters her name, she gets a greeting, as shown in Figure 1-3.

Figure 1-3: The beginning of the greeting. Press the button for the rest.

The rest of the greeting happens in a second dialog box, shown in Figure 1-4. It incorporates the username supplied in the first dialog box.

Figure 1-4: Now the greeting is complete.

The output may not seem that incredible, but take a look at the source code to see what’s happening:

“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>

prompt.html


Creating a variable for data storage

This program is interesting because it allows user interaction. The user can enter a name, which is stored in the computer and then returned in a greeting. The key to this program is a special element called a variable. Variables are simply places in memory for holding data. Any time you want a computer program to “remember” something, you can create a variable and store your information in it.

Variables typically have the following characteristics:

♦ The var statement: You can indicate that you’re creating a variable with the var command.

♦ A name: When you create a variable, you’re required to give it a name.

♦ An initial value: It’s useful to give each variable a value immediately.

♦ A data type: JavaScript automatically determines the type of data in a variable (more on this in the upcoming “Understanding Variable Types” section), but you should still be clear in your mind what type of data you expect a variable to contain.

Asking the user for information

The prompt statement does several interesting things:

♦ Pops up a dialog box. This modal dialog box is much like the one the alert() method creates.

♦ Asks a question. The prompt() command expects you to ask the user a question.

♦ Provides space for a response. The dialog box contains a space for the user to type a response and buttons for the user to click when he’s finished or wants to cancel the operation.

♦ Passes the information to

Return Main Page Previous Page Next Page

®Online Book Reader