Scribd
Upload
433 views

Web Program For A Simple Calculator

This document outlines a simple JavaScript program to design a calculator that performs basic math operations (addition, subtraction, multiplication, division). It includes HTML code to create a table interface for the calculator with input fields for two values and a button for each operation. The JavaScript code defines functions to calculate the result when a button is clicked, retrieve the input values, perform the operation, and display the output. It also includes a clear button to reset the values.

Uploaded by

sirius
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
433 views

Web Program For A Simple Calculator

This document outlines a simple JavaScript program to design a calculator that performs basic math operations (addition, subtraction, multiplication, division). It includes HTML code to create a table interface for the calculator with input fields for two values and a button for each operation. The JavaScript code defines functions to calculate the result when a button is clicked, retrieve the input values, perform the operation, and display the output. It also includes a clear button to reset the values.

Uploaded by

sirius
Copyright
© © All Rights Reserved
Available Formats
Download as TXT, PDF, TXT or read online on Scribd
You are on page 1/ 2

SIMPLE CALCULATOR USING JAVASCRIPT

1.Write a JavaScript to design a simple calculator to perform the following


operations:
sum, product, difference and quotient.
Aim:
To Write a JavaScript to design a simple calculator
Algorithm/Procedure:
1. Create a webpage with the name program1.html.
2. Create table for Calculator using Html code.
3. Create html form and input field for each entry.
PROGRAM:
<!DOCTYPE
HTML> <html>
<head>
<style>
table, td, th
{
border: 1px solid black;
width: 33%;
text-align: center;
background-color: DarkGray;
border-collapse:collapse;
}
table { margin: auto; }
input { text-align:right; }
</style>
<script type="text/javascript">
function calc(clicked_id)
{
Var val1 =
parseFloat(document.getElementById("value1").value);
var val2 =
parseFloat(document.getElementById("value2").value);
if(isNaN(val1)||isNaN(val2))
alert("ENTER VALID NUMBER");
else if(clicked_id=="add")
document.getElementById("answer").value=val1+val
2;
else if(clicked_id=="sub")
document.getElementById("answer").value=val1-
val2;
else if(clicked_id=="mul")
document.getElementById("answer").value=val1*val2;
else if(clicked_id=="div")
document.getElementById("answer").value=val1/val2;
}
function cls()
{
value1.value="0";
value2.value="0";
answer.value="";
}
</script>
</head>
<body>
<table>
<tr><th colspan="4"> SIMPLE CALCULATOR </th></tr>
<tr><td>value1</td><td><input type="text" id="value1"
value="0"/></td> <td>value2</td><td><input type="text" id="value2"
value="0"/> </td></tr> <tr><td><input type="button" value="Addition"
id = "add" onclick="calc(this.id)"/></td>
<td><input type="button" value="Subtraction" id = "sub"
onclick="calc(this.id)"/></td>
<td><input type="button" value="Multiplication" id = "mul"
onclick="calc(this.id)"/></td>
<td><input type="button" value="Division" id ="div"
onclick="calc(this.id)"/></td></tr>
<tr><td>Answer:</td><td> <input type="text" id="answer" value=""
disabled/></td>
<td colspan="2"><input type="button" value="CLEAR ALL"
onclick="cls()"/></td> </tr>
</table>
</body>
</html>

You might also like