21xrx.com
2025-03-27 11:15:57 Thursday
文章检索 我的文章 写文章
使用JavaScript编写简易计算器代码
2023-06-11 05:11:11 深夜i     9     0

我最近在学习JavaScript,最近写了个简易计算器,来分享一下代码。

计算器的HTML代码:

+  -  *  /
计算

在HTML中我建立了两个输入框,用户可以输入数字,下拉菜单让用户选择运算符。还有一个“计算”按钮,点击后就会运行calculate()函数。最后,将结果输出到一个名为“result”的段落中。

接下来是JavaScript代码:

script
function calculate() {
  var num1 = Number(document.getElementById("num1").value);
  var num2 = Number(document.getElementById("num2").value);
  var operator = document.getElementById("operator").value;
  var result;
  switch (operator) {
    case "add":
      result = num1 + num2;
      break;
    case "subtract":
      result = num1 - num2;
      break;
    case "multiply":
      result = num1 * num2;
      break;
    case "divide":
      result = num1 / num2;
      break;
  }
  document.getElementById("result").innerHTML = "计算结果为:" + result;
}

首先,我们定义了calculate()函数,它通过使用`getElementById()`来获取所需元素的值。然后,使用`switch`语句将这些值与每个运算符进行比较。然后,我们对两个数字执行适当的计算操作并将结果存储在变量“result”中。最后,我们使用`innerHTML`将结果输出到HTML代码中的**p**段落中。

三个关键词是JavaScript、计算器、简易。

  
  

评论区