如何在特定的div中显示时间（由JavaScript生成）？

在学习JavaScript时，我发现了以下代码：

function printTime() {
  var d = new Date();
  var hours = d.getHours();
  var mins = d.getMinutes();
  var secs = d.getSeconds();
  document.body.innerHTML = hours+":"+mins+":"+secs;
}

setInterval(printTime, 1000);

在Codepen中，当HTML和CSS部分为空时，这不会显示任何内容。主要问题是：如何在HTML文档中的特定位置插入生成的时间

例如，时间应该放在这个div中：

<div id="time" class="main__section--time">
    /* show time here */
</div>

/*在这里表演时间*/

---

如何将此函数链接到ID或类以显示此div中的输出？

而不是

document.body.innerHTML

您只需使用

document.getElementById（“time”）.innerHTML

您必须修改

printTime

函数如下：

function printTime() {
  var d = new Date();
  var hours = d.getHours();
  var mins = d.getMinutes();
  var secs = d.getSeconds();
  // select the div by its id
  document.getElementById("time").innerHTML = hours+":"+mins+":"+secs;
}

请在下面的代码段中尝试：

函数printTime（）{
var d=新日期（）；
var hours=d.getHours（）；
var mins=d.getMinutes（）；
var secs=d.getSeconds（）；
document.getElementById（“time”）.innerHTML=hours+“：“+mins+”：“+secs；
}
设置间隔（打印时间，1000）
您可以使用
document.querySelector
和引用页面上的特定元素


var-timedisplayement=document.querySelector（“#我的时间”）；
函数printTime（）{
var d=新日期（）；
var hours=d.getHours（）；
var mins=d.getMinutes（）；
var secs=d.getSeconds（）；
timeDisplayElement.innerHTML=hours+“：“+mins+”：“+secs；
}
设置间隔（打印时间，1000）
使用
document.getElementById（“time”）.innerHTML=…
您需要使用

document.getElementById（“时间”）

然后访问它的innerHTML属性

function printTime() { 
     var d = new Date(); 
     var hours = d.getHours(); 
     var mins = d.getMinutes(); 
     var secs = d.getSeconds();
     document.body.innerHTML= hours+":"+mins+":"+secs;
}  
 setInterval(printTime, 1000);