题目：

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

思路：

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

实现步骤：

01基础HTML代码
HTML代码如下：

<div id="app">
  <span>数字1：</span>
  <input type="text" id="num1" style="font-size: 18px" />
  <br /><br />
  <span>数字2：</span>
  <input type="text" id="num2" style="font-size: 18px" />
  <br /><br />
  <span>结 果：</span>
  <input type="text" id="result" style="font-size: 18px" />
  <br /><br />
  <button onclick="calculator('+')">+</button>
  <button onclick="calculator('-')">-</button>
  <button onclick="calculator('*')">*</button>
  <button onclick="calculator('÷')">÷</button>
</div>

02JavaScript代码
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;
}