关于在javascript中运行计时器的问题

【问题标题】：Problem regarding running timer in javascript关于在javascript中运行计时器的问题
【发布时间】：2020-07-15 20:53:29
【问题描述】：

我编写了以下代码，以在单击按钮时运行计时器并在单击另一个按钮时停止计时器。但是，它在代码加载时以及当我单击停止计时器时第一次工作，但是当我单击开始时间之后，计时器开始运行并且不会在再次单击停止时间按钮时停止。代码如下：

var myVar = setInterval(myTimer ,1000);

function myTimer() {
    var d = new Date();
    document.getElementById("demo").innerHTML = d.toLocaleTimeString();
}

function settime(){
    var myVar = setInterval(myTimer ,1000);
}

<html>
    <body>
        <p>A script on this page starts this clock:</p>
        <button onclick="clearInterval(myVar)">Stop time</button>
        <button onclick="settime()">Start time</button>
        <p id="demo"></p>
    </body>
</html>

【问题讨论】：

我删除了评论，我没有看到答案。

标签： javascript timer

【解决方案1】：

var myVar 在setTime 中重新声明myVar，导致它隐藏clearInterval 正在使用的myVar 的外部声明。

解决方案是在setTime 中省略var 关键字。

您可能还想在启动计时器之前停止它。在查看Stop 按钮是否有效之前，按两次Start 按钮检查是否正确。

【讨论】：

感谢 traktor53，它现在工作正常。我也尝试使用相同的按钮来启动和停止时间。即最初在窗口加载时运行时间并且按钮文本是停止时间，当单击它时，按钮文本更改为开始时间并且时间停止。然后再次单击同一按钮时，其文本更改为停止时间并启动计时器。我应该为此使用按钮的 innerHTML 属性吗
innerHTML 属性适用于设置按钮的内容。可以参考MDN上的<button>按钮可以给出什么内容。