# 简单的计算器
* 使用 HTML 和 JavaScript 编写出简单的网页计算器
~~~
<!-- IVT软件工程20171009课堂作业.陈旭华 -->
<!DOCTYPE html>
<html >
<head>
<title>简单的计算器</title>
<style type="text/css">
body {text-align:center}
</style>
</head>
<body>
<h1>简单的计算器</h1>
<div>
<input id="Number1" type="number" />
<input id="AdditionButton" type="button" value="+" />
<input id="SubtractionButton" type="button" value="-" />
<input id="MultiplicationButton" type="button" value="*" />
<input id="DivisionButton" type="button" value="/" />
<input id="Number2" type="number" />
</div>
<label id="Result"></label>
</body>
<script>
window.onload = function () {
var n1 = document.getElementById("Number1");
var n2 = document.getElementById("Number2");
var AdditionButton = document.getElementById("AdditionButton");
var Result = document.getElementById("Result");
AdditionButton.onclick = function () {
//创建onclick触发事件
var Num1 = n1.value;
var Num2 = n2.value;
//获取文本框输入的值
var FloatNum1 = parseFloat(Num1);
var FloatNum2 = parseFloat(Num2);
//解析字符串，转换为浮点数
var Num3 = FloatNum1 + FloatNum2;
//进行数学运算，并返值给变量
Result.innerHTML = Num3;
//向对象(id:Result)插入变量(var:Num3)的内容
};
SubtractionButton.onclick = function () {
var Num1 = n1.value;
var Num2 = n2.value;
var FloatNum1 = parseFloat(Num1);
var FloatNum2 = parseFloat(Num2);
var Num3 = FloatNum1 - FloatNum2;
Result.innerHTML = Num3;
};
MultiplicationButton.onclick = function () {
var Num1 = n1.value;
var Num2 = n2.value;
var FloatNum1 = parseFloat(Num1);
var FloatNum2 = parseFloat(Num2);
var Num3 = FloatNum1 * FloatNum2;
Result.innerHTML = Num3;
};
SubtractionButton.onclick = function () {
var Num1 = n1.value;
var Num2 = n2.value;
var FloatNum1 = parseFloat(Num1);
var FloatNum2 = parseFloat(Num2);
var Num3 = FloatNum1 - FloatNum2;
Result.innerHTML = Num3;
};
DivisionButton.onclick = function () {
var Num1 = n1.value;
var Num2 = n2.value;
var FloatNum1 = parseFloat(Num1);
var FloatNum2 = parseFloat(Num2);
var Num3 = FloatNum1 / FloatNum2;
Result.innerHTML = Num3;
};
};
</script>
</html>
~~~
