原生js实现加减乘除（计算器）

最新推荐文章于 2023-02-03 19:23:11 发布

北辰Beichen

最新推荐文章于 2023-02-03 19:23:11 发布

阅读量1.4k

点赞数 2

分类专栏：不一样的前端文章标签： js

本文链接：https://blog.csdn.net/beichenxiansen/article/details/107196988

版权

不一样的前端专栏收录该内容

59 篇文章 0 订阅

订阅专栏

原生js实现简单加减乘除计算

这是一个小的demo

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>计算机</title>
		<style>
			#qq{
				width: 200px;
				height: 50px;
				border: 1px solid green;
			}
		</style>
	</head>
	<body>
		<div>
			<input type="text" placeholder="请输入第一个数" id="txt1"/>
		</div>
		<div>
			<input type="text" placeholder="请输入第二个数" id="txt2"/>
		</div>
		<div>
			<input type="button" value="开始计算" id="btn"/>
		</div>
		<div id="qq">
			
		</div>
	</body>
	<script type="text/javascript">
		  var txt1=document.getElementById("txt1");
            var txt2=document.getElementById("txt2");
            var btn=document.getElementById("btn");
            var qq=document.getElementById("qq");
            btn.οnclick=function()
            {
            	var d1=Number(txt1.value);
            	console.log("变量d1的数据类型是："+typeof d1);
            	var d2=Number(txt2.value);
            	console.log("变量dl的数据类型是："+typeof d2);
            	var ve=d1*d2 //加减乘除自行切换
            	qq.innerHTML=ve
            }
	</script>
</html>