Part 2 - Alerts, Prompts & Variables
This command will make a popup box appear (click here to see it in action). This can be useful for warning users about things or (in some cases) giving them instructions. It is used in the following way:
alert('Text for alert box');
<!-- Start Hide
// Display the alert box
alert('This text is in an alert box');
// End Hide-->
This is placed between the <head> and </head> tags of the page. As you can see, I have used a comment tag as well as the alert box code. This makes your code more readable but is not essential.
should have the value:
Variables can also contain text for example the variable:
could have the value:
Variables can be very useful for text or numbers that you repeat several times in a program, for doing calculations or for getting input from a user. Variables are declared as follows:
var my_number = 3456;
var my_name = 'David Gowans';
You can do calculations if you have variables containing numbers. Here is an example of some code which does a calculation:
// Set Variables
var first_number = 15;
var second_number = 5;
var third_number = 10;
var fourth_number = 25;
var new_number = first_number + second number
var answer = new_number * third_number
var answer = answer / fourth_number
This code sets four number variables. It then adds the first and second numbers together and stores the answer as a variable called new_answer. Then it multiplies new_number by the third number and stores the answer as answer. Finally, it divides the answer by the fourth_number to get a new value for the answer.
Getting Information From The User
Once you have started using variables you will realize that it will be quite useful to get some information from the user. You can do this by using the:
command. Take a look at this example. I will explain how this works.
First of all, the new prompt command is used. I set the variable your_n
ame using it:
var your_name = prompt('Please enter your name', 'Your Name');
The text between the first set of quotes is what is written on the prompt box. The text between the second set of quotes is what is the default text for the input section of the box.
After this I have to create the output string. I do this by adding together the input with two strings I declared earlier (view the source on the example page for more information):
var output_text = welcome_text + your_name + closing_text;
As you can see this is much the same as adding 3 numbers together but, as these are strings they will be put one after the other (you could have also used quotes in here to add text and strings together). This added the text I had set as the welcome_text to the input I had received and then put the closing_text on the end.
Finally I displayed the output_text variable in an alert box with the following code:
which, instead of having text defined as the content for the alert box, places the string in the box.
In part 3 I will show you how to display information in the page.
1999 - 2001 David Gowans