请开发设计一个网页计算器，实现数据的加减乘除。

设计一个简单的网页计算器，可以分为以下几个步骤：

1. **HTML结构**:
创建一个基础的HTML布局，包含输入框、按钮以及结果显示区域。例如：

   <div id="calculator">
     <input type="text" id="display" disabled>
     <div class="buttons">
       <!-- 数字和运算符按钮 -->
       <button>1</button> ... <button>0</button>
       <button>=</button>
       <button>+</button> <button>-</button> <button>*</button> <button>/</button>
     </div>
   </div>

2. **CSS样式**:
确保按钮大小合适，间距合理，并设置相应的交互效果。

3. **JavaScript逻辑**:
- `display` 输入框用于显示计算结果。
- 为每个数字和运算符按钮添加事件监听器，当点击时获取输入值，执行对应的计算操作（如`addEventListener('click', function() {...})`）。
- 当用户按下等号或等于按钮时，将当前输入框的内容作为两个操作数，根据上一次选择的操作符（可能是从历史记录中获取的），执行加、减、乘、除并更新显示结果。
- 对于除法，需要处理除数为零的情况。

let currentOperation = '';
let firstOperand = '';

// 获取元素
const display = document.getElementById('display');
const buttons = document.querySelectorAll('.buttons button');

// 添加事件处理器到按钮
buttons.forEach(button => {
  if (button.textContent !== '+' && button.textContent !== '-') {
    button.addEventListener('click', handleNumberClick);
  } else {
    button.addEventListener('click', handleOperatorClick);
  }
});

function handleNumberClick(event) {
  // ...
}

function handleOperatorClick(event) {
  // ...
  // 根据currentOperation和firstOperand做相应的运算
  // 更新显示结果
}

// 其他辅助函数，如存储历史操作、清除输入等