In: Computer Science
There are four basic functions in math. They are addition, subtraction, multiplication and division. Children in 1st grade focus on addition. They are required to memorize their addition facts from 1 to 12.
Create a function that prompts the user to enter a number between 1 and 12. Then display - using the input supplied - the addition and subtraction math facts for that number from 1 to 12 for the number entered. The output should be the results of the mathematical calculations.
See below example below:
The user enters "5" as their input. Below is the expected output.
Addition Math Facts for "5"
5 + 1 = 6
5 +2 = 7
...
5 + 11 = 16
5 + 12 = 17
Subtraction Math Facts for "5"
12 - 5 =
11 - 5 =
10 - 5 =
...
7 - 5 = 2
6 - 5 = 1
5 - 5 = 0
* Please note the subtraction facts should stop at the input number - the input number because 1st graders are not prepared to learn about negative numbers.
If the user enters a number not between 1 and 12, open an alert window stating that it is an invalid number, and prompt them to enter a number again meeting the criteria. Finally, if the number entered is bellow 6, make the background color blue and the text white, if the number is above 6 make the background color red and the text yellow, and if the number is six then make the background color white and the text black.
* must use HTML and java script. Must make program in brackets.
HINT: use a variable and a window.prompt() to store what the person enters, a conditional statement, and string concatenation using HTML .
If you have any doubts, please give me comment...
<!DOCTYPE html>
<html>
<head>
<title>Basic math</title>
</head>
<body>
<div id="results"></div>
<script type="text/javascript">
function showMath() {
var n = prompt("Enter number from 1 to 12: ");
if (n < 1 || n > 12) {
n = alert("Invalid number! It must be between 1 and 12");
n = prompt("Enter number from 1 to 12: ");
}
if (n < 6) {
document.getElementById("results").style.backgroundColor = "blue";
document.getElementById("results").style.color = "white";
} else if (n > 6) {
document.getElementById("results").style.backgroundColor = "red";
document.getElementById("results").style.color = "yellow";
}
var str = "";
str = "<b>Addition Math Facts for \"" + n + "\"</b>";
for (i = 1; i <= 12; i++)
str += "<div>" + n + " + " + i + " = " + (i + n) + "</div>";
str += "<b>Subtraction Math Facts for \"" + n + "\"</b>";
for (i = 12; i >= n; i--)
str += "<div>" + n + " - " + i + " = " + (i - n) + "</div>";
document.getElementById("results").innerHTML = str;
}
showMath();
</script>
</body>
</html>