如何使用javascript在特定时间更改html文本

如何使用javascript在特定时间更改html文本 比如说

<p class="timer">00:00</p>

00:00

JavaScript具有函数

setInterval

和

setTimeout

来计时

setInterval

将其第一个参数作为函数，第二个参数作为运行它的时间间隔（以毫秒为单位）

首先，你要计算下一分钟还有多长时间，这可以通过这样做来实现

60-（新建日期（）.getSeconds（））

在此之后，您希望代码每分钟重复一次（每60000毫秒重复一次）

那么，让我们先编写一个函数，用当前时间替换元素的内容

function replaceContentsOfElement(){
    document.querySelector(".timer").innerHTML = new Date().getHours() + ":" + new Date().getMinutes()
}

下一步是结合

setTimeout

、

setInterval

，以及我们的函数来生成结果。在函数定义之后，您可以编写

setTimeout(function(){
    replaceContentsOfElement(),
    setInterval(replaceContentsOfElement, 60000)
}, 60 - (new Date().getSeconds()))

---

或者，您也可以每秒钟检查一次并更新时间，但这样做效率不高。

类似的操作会在1秒后更改文本。这样你就可以看到它是如何工作的

// HTML
<p id="myId" class="timer">00:00</p>
<p id="myId2" class="timer">00:00</p>

// JS
var text = document.getElementById("myId");
var text2 = document.getElementById("myId2");

var intervalID = window.setInterval(myCallback, 1000);

function myCallback() {
  text.textContent = "Changed after 1 second";
}

var timer = setInterval(setTime, 1000);

function setTime(){
  text2.textContent = new Date().getHours() + ':' + new Date().getMinutes() + ':' + new Date().getSeconds();
}

//HTML
00:00
00:00
//JS
var text=document.getElementById（“myId”）；
var text2=document.getElementById（“myId2”）；
var intervalID=window.setInterval（myCallback，1000）；
函数myCallback（）{
text.textContent=“1秒后更改”；
}
var定时器=设置间隔（设置时间，1000）；
函数setTime（）{
text2.textContent=new Date（）.getHours（）+'：'+新日期（）.getMinutes（）+'：'+新日期（）.getSeconds（）；
}

请注意，页面加载时显示为“00:00”，一秒钟后会更新

---

编辑-笔现在显示时间，并将永远每秒更新一次。

请参阅或的文档，以精确时间并更改文本！你有没有试过搜索一下？