如何重复以消息框结束的计时器？

在前端开发中，我们可以使用JavaScript来实现重复以消息框结束的计时器。以下是一个简单的实现示例：

// 创建一个全局变量用于存储计时器ID
var timerId;

// 定义计时器函数
function startTimer(duration, display) {
  var timer = duration, minutes, seconds;
  
  // 使用 setInterval 方法每秒更新计时器
  timerId = setInterval(function () {
    minutes = parseInt(timer / 60, 10);
    seconds = parseInt(timer % 60, 10);

    minutes = minutes < 10 ? "0" + minutes : minutes;
    seconds = seconds < 10 ? "0" + seconds : seconds;

    display.textContent = minutes + ":" + seconds;

    // 当计时器归零时，显示消息框并清除计时器
    if (--timer < 0) {
      clearInterval(timerId);
      alert("计时结束！");
    }
  }, 1000);
}

// 在页面加载完成后调用计时器函数
window.onload = function () {
  var duration = 60 * 5, // 设置计时器持续时间为5分钟
      display = document.querySelector('#timer');
  startTimer(duration, display);
};

在这个示例中，我们首先创建了一个全局变量timerId用于存储计时器的ID。然后定义了一个startTimer函数，它接受计时器的持续时间和用于显示计时器的DOM元素作为参数。在函数内部，我们使用setInterval方法每秒钟更新一次计时器。当计时器归零时，我们通过clearInterval方法清除计时器并弹出一个消息框。

为了在页面加载完成后开始计时，我们使用window.onload事件将计时器函数绑定到页面。在示例中，计时器持续时间被设置为5分钟，并且通过querySelector方法选中一个具有id="timer"的DOM元素来显示计时器。

这是一个简单的实现，您可以根据实际需求进行扩展和优化。