Javascript 试着做一个时钟

这段代码出了什么问题，我一直在试图找出它为什么不起作用，但我找不到错误

var sec = 0;
var min = 0;
var hour = 0;
var p = document.getElementById("p");
function clock() {
    sec++;
    p.innerHTML = hour + ":" + min + ":" + sec; 
    if (sec == 60) {
        sec = 0;
        min++;
    }
    if (min == 60) {
        min = 0;
        hour++; 
    }
};
window.setInterval(clock,1000);

---

该代码将只在元素中显示99，并且仅当代码位于HTML中id值为p的元素下方的脚本标记中时才会显示99。例如，或类似；注意，getElementById通过其id值而不是标记名获取元素。这是因为在调用getElementById时，如果元素的HTML尚未解析，则该元素将不存在，因此getElementById将返回null

要使其显示其他内容，请更改

p.innerHTML = 99; // ...

…实际显示秒、分钟和小时的值

还要注意的是，你给setInterval的时间间隔只是一个近似值，所以这个时钟会漂移

下面是一个完整的示例，请注意script标记与div id=p标记的关系，以及我对上面提到的JavaScript行所做的更改：

…然后每次时钟运行时，获取从那时起经过的总毫秒数：

var elapsed = new Date() - start;

---

…然后计算每秒1000毫秒，等等，以计算它已经运行了多长时间。

我假设您的脚本位于或加载在文档的内部

浏览器从上到下解析页面。这会导致脚本在加载文档的其余部分之前运行，并且您的-元素还不存在。您的脚本必须等待文档完全加载后才能使用-元素。要实现这一点，只需使用窗口对象的onLoad事件

---

不工作不是一个有用的问题描述。它怎么不起作用？你看到了什么而不是你所期望的？对我来说很好->很好的开场白。但是为什么要使用load而不仅仅是将脚本放在末尾呢？在页面加载过程中，加载发生得很晚。另外请注意，IE8没有addEventListener，但仍有大量用户…。@t.J.Crowder谢谢。我使用load是因为它是我所知道的最简单、自解释、基于事件的方法。我试图只回答这个问题，而不引入速度和浏览器兼容性等其他问题。将代码移到底部也会起作用，但我认为这将是一个很好的机会，可以将OP介绍给JS处理事件的方式。setInterval只是一个近似值，所以这个时钟会漂移。-说得好。这就是为什么要显示实际时间的东西应该使用setInterval或setTimeout来触发显示更新，但是使用来确定它是什么时间或者计时器启动后经过了多少时间。

var start = new Date();

var elapsed = new Date() - start;

// This binds a function to a specific event.
// In our case, that's the onLoad event of the window object.
// The function gets called as soon as the entire document is done loading.
window.addEventListener("load", function() {
    var sec = 0;
    var min = 0;
    var hour = 0;
    // This line failed because an element with the ID "p" did not exist yet.
    // That's why you should wrap it in the onLoad event.
    var p = document.getElementById("p");
    function clock(){
        sec++;
        p.innerHTML = hour + ":" + min + ":" + sec; 
        if(sec == 60){
            sec = 0;
            min++;
        }
        if(min == 60){
            min = 0;
            hour++; 
        }
    };
    window.setInterval(clock,1000);
});