JavaScript实现的数字计时器点击启动无响应问题求助

共存在2处明显错误导致点击无响应：

• 第一处：DOM元素ID匹配错误
  你在HTML里给显示计时的h1标签设置的id是timer-display，但JavaScript代码中更新内容时写的是document.getElementById("timer.display")，将横杠误写为点，无法找到对应元素，执行到这一步会直接抛出错误，程序中断运行。
• 第二处：Date构造函数语法不完整
  clockRunning函数中var currentTime = new Date漏写了构造函数调用的括号，规范写法应为new Date()，部分浏览器对缺省括号的兼容存在异常，也可能导致时间计算失败。

修复后的完整JavaScript代码 #

var timeBegan = null; // 计时器是否已启动
var timeStopped = null; // 计时器停止的时间点
var stoppedDuration = 0; // 计时器总暂停时长
var startInterval = null; // 定时器标识，用于清除定时器
var flag = false; // 控制计时器启停状态的标记

const timerContainer = document.getElementsByClassName("timer-container")[0];

timerContainer.addEventListener("click", function()
{
    if(!flag)
    {
        startTimer();
        flag = true;
    }
    else
    {
        stopTimer();
        flag = false;
    }
})
function startTimer()
{
    if(timeBegan === null)
        timeBegan = new Date();

    if(timeStopped !== null)
        stoppedDuration += (new Date() - timeStopped);

    startInterval = setInterval(clockRunning, 10);
}

function stopTimer()
{
    timeStopped = new Date();
    clearInterval(startInterval);
}
function clockRunning()
{   
var currentTime = new Date(); // 修复：补全Date构造函数括号
var timeElapsed = new Date(currentTime - timeBegan - stoppedDuration);

var minutes = timeElapsed.getUTCMinutes();
var seconds = timeElapsed.getUTCSeconds();
var milliseconds = timeElapsed.getUTCMilliseconds();

milliseconds = Math.floor(milliseconds/10);
// 修复：修改ID为正确的timer-display
document.getElementById("timer-display").innerHTML = 
(minutes = minutes < 10 ? '0' + minutes:minutes) + ":" +
(seconds = seconds < 10 ? '0' + seconds:seconds) + ":" +
(milliseconds = milliseconds < 10 ? '0' + milliseconds:milliseconds);
}

修改后点击容器即可正常启停计时。

内容的提问来源于stack exchange，提问作者swissgamer63de