实现简单计算器

最新推荐文章于 2023-04-02 14:42:37 发布

千璃夫人

最新推荐文章于 2023-04-02 14:42:37 发布

阅读量161

点赞数

CC 4.0 BY-SA版权

文章标签： js

本文链接：https://blog.youkuaiyun.com/qq_39363987/article/details/82763774

本文介绍了一个简单的JavaScript网页计算器的实现过程，通过使用HTML元素与JavaScript代码相结合的方式，实现了基本的四则运算功能。用户可以通过选择不同的运算符进行加、减、乘、除操作，并将结果显示在界面上。

Document + - * / =

<script type="text/javascript">
	//查找页面元素
	var b=document.getElementById('btn');
	var slt=document.getElementById('sel');
	var txt1=document.getElementById('txt1');
	var txt2=document.getElementById('txt2');
	var txt3=document.getElementById('txt3');
	//给按钮添加点击事件
	b.onclick=function(){
		//取出输入框的值
		var v1=parseFloat(txt1.value);
		var v2=parseFloat(txt2.value);
		var result;//保存运算结果
		//取出运算符,判断是什么运算符
		switch(slt.value){
			case '+':
				result=v1+v2;
			break;
			case '-':
				result=v1-v2;
			break;
			case '*':
				result=v1*v2;
			break;
			case '/':
				result=v1/v2;
			break;
			default:
				result=v1+v2;
			break;
		}
		//将运算结果放入输入框中
		txt3.value=result;
	};

	// console.log(b);
</script>