In this project you will write a simple calculator program. You may
find it useful to refer back to your MadLibs page to see examples of
a button, a function definition, and calls to the
If your code isn't working as expected, try opening up Firefox's error console to check for (potentially) helpful error messages. If you get stuck, don't hesitate to ask the instructor or a teaching assistant for help.
In this project you will create a simple calculator in a new page. Your calculator will prompt the user for two numbers and then display the sum, the product, the difference, and the quotient of those two numbers. A sample session might look like the following:
[prompt] Please enter the first number. [user enters] 3 [prompt] Please enter the second number. [user enters] 4 [Output] 3 + 4 = 7 3 - 4 = -1 3 * 4 = 12 3 / 4 = .75
Tip: Here are some handy keyboard shortcuts:
Select-All: Command-A (Mac), Control-A (Windows)
Copy: Command-C (Mac), Control-C (Windows)
Paste: Command-V (Mac), Control-V (Windows)
Note: The values returned by the
promptfunction are strings, not numbers. What is the result if you try to use the
+operator on those values?
Tip: Before you can perform arithmetic on string values they must be converted to numbers using the built-in
parseFloatfunction. For example, if the variable
firstNumcontains the string "3", the following command will convert it to the number 3:firstNum = parseFloat(firstNum);
Tip: There are several possible ways to complete this exercise. One possibility would be to create four variables to store the the sum, the product, the difference, and the quotient. You can then use the "+" operator to build the output string. For example, the first output statement might look something like the following: [Click on the
alertcall above to see an explanation. Click on it again to make the explanation disappear.]
Edit the main COMP 105 web page you created in the first
lab and add a link to your new Calculator page.
(This should be the fourth link in your set of links
to COMP 105 assignments, after Mini-Lab 1, MadLibs, and the Numbers
Part II mini-lab follow-up.)
In the link, refer to your new page with a relative pathname
which is just the name of the file (e.g.,
This tells the browser that the file to look for is in the same
directory or folder as the current file (your main COMP 105 web page,
in this case).
You do not want to give
a full or absolute pathname, like
because the location of your file on the
peopleftp.kzoo.edu server will not be the same as on
your own laptop or classroom computer.
If you worked in a team, each member of your group should do this, so each of you has a link to your calculator page.
people.kzoo.eduserver (remember that its host name for uploading is
peopleftp.kzoo.edu). Test that the link to the calculator project works on the server by clicking on it from your home page.