网页时钟无法正常运行求助：附代码求排查修复

你的代码存在几处错误，导致时钟无法正常工作，以下是问题点和修复方案：

错误点分析 #

• DOM方法拼写错误：第一行的document.getElementsById多了个s，正确的单个元素获取方法是document.getElementById。
• 补零逻辑颠倒：三元运算符的判断条件写反了，比如h > 10 ? "0" + h: h应该改为h < 10 ? "0" + h : h，否则小于10的数字无法自动补零。
• 语法错误：ampmEl, (innerText= ampm);使用了错误的逗号运算符，正确写法是ampmEl.innerText = ampm;。
• 未实现定时刷新：setTimeout的回调函数内没有调用updateClock()，导致时钟仅初始化一次，不会每秒更新。

修正后的完整代码 #

const hourEl = document.getElementById("hour");
const minuteEl = document.getElementById("minutes");
const secondsEl = document.getElementById("seconds");
const ampmEl = document.getElementById("ampm");

function updateClock() {
    let h = new Date().getHours();
    let m = new Date().getMinutes();
    let s = new Date().getSeconds();
    let ampm = "AM";

    if (h > 12) {
        h = h - 12;
        ampm = "PM";
    }

    // 修正补零逻辑
    h = h < 10 ? "0" + h : h;
    m = m < 10 ? "0" + m : m;
    s = s < 10 ? "0" + s : s;
    
    hourEl.innerText = h;
    minuteEl.innerText = m;
    secondsEl.innerText = s;
    ampmEl.innerText = ampm;
    
    // 定时触发时钟更新
    setTimeout(updateClock, 1000);
}

updateClock();

内容的提问来源于stack exchange，提问作者Kyle Gabriel Dones