实现计算器功能

2021-12-02 21:02:26 阅读：174 来源： 互联网

标签：功能 num1 num2 实现 Number value result 计算器 operate

任务描述：

对于一些小数值的计算，大家可以很快的得出结果，例如：10+10=20，但是对于一些大数值的计算，例如：9516+7534，算出结果可能需要一些时间。说到这，肯定会有小伙伴想到了计算器，没错，计算器可以快速的得到计算结果。那么：接下来就让我们亲手做一个可以进行加减乘除的计算器吧！

代码段：

<!DOCTYPE html>
<html lang="en">

<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>Document</title>
	<script>
		window.onload = function () {
			// 获取输入的值
			var num1 = document.getElementById('num1');
			var operate = document.getElementById('operate');
			var num2 = document.getElementById('num2');
			var btn = document.getElementById('btn');
			var result = document.getElementById('result');
			// 给btn设置onclick事件，用于最终的计算
			btn.onclick = function () {
				// 加减乘除的切换
				if (operate.value == '+') {
					result.value = Number(num1.value) + Number(num2.value);
				} else if (operate.value == '-') {
					result.value = Number(num1.value) - Number(num2.value);
				} else if (operate.value == '*') {
					result.value = Number(num1.value) * Number(num2.value);
				} else if (operate.value == '/') {
					result.value = Number(num1.value) / Number(num2.value);
				}
			}
		}
	</script>
</head>

<body>
	<!-- 小型计算器外形 -->
	<input type='text' id='num1' />
	<select id='operate'>
		<option value='+'>+</option>
		<option value="-">-</option>
		<option value="*">*</option>
		<option value="/">/</option>
	</select>
	<input type='text' id='num2' />
	<input type='button' value=' = ' id="btn" />
	<input type='text' id='result' />

</body>

</html>

标签：功能,num1,num2,实现,Number,value,result,计算器,operate
来源： https://blog.csdn.net/m0_52484611/article/details/121686131

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

实现计算器功能

任务描述：

代码段：