javascript 实现简单计算器

javascript可以帮助我们进行数字的运算，那么如何使用javascript制作简单的计算器呢？下面小编给大家分享一下。

工具/材料

Sublime text

操作方法

首先在Sublime Text中新建一个HTML文件，如下图所示

然后在body区域中布局计算器的界面，如下图所示

接下来在style标签中给布局定义样式，如下图所示

最后在script标签内实现计算器的运算逻辑，如下图所示

运行页面程序以后我们就可以看到如下图所示的计算器了

JavaScript简易计算器

JavaScript实例08 | 简易计算器

题目：

实现如图所示的一个简易计算器，可以进行两个数字的加减乘除运算。

思路：

获取数字1和数字2的值，根据选择的不同的运算法，走不同的运算分支，算出结果。

实现步骤：

基础HTML代码

HTML代码如下：

JavaScript代码

JavaScript通过 if ... else if ... else 分支语句来计算不同的运算，代码如下。

//函数的定义function calculator(sign) { // 获取数字值 var n1 = document.getElementById("num1").value; var n2 = document.getElementById("num2").value; // 初始化结果 var result; // 根据不同的运算符做不同的运算 // 如果是加号，做加法运算 if (sign == " ") { result = parseInt(n1) parseInt(n2); } /// 如果是减号，做减法运算 else if (sign == "-") { result = parseInt(n1) - parseInt(n2); } // 如果是乘号，做乘法运算 else if (sign == "*") { result = parseInt(n1) * parseInt(n2); } // 如果是除号，做除法运算 else if (sign == "÷") { result = parseInt(n1) / parseInt(n2); } // 如果都不是，则报错后，返回 else { alert('输入错误'); return; } // 写入结果 document.getElementById("result").value = n1 "" sign "" n2 "=" result;}

完工。

关注我，学习不迷路。