如何 - JavaScript 倒计时器
了解如何使用 JavaScript 创建倒计时器。
自己尝试 »
创建倒计时器
示例
<!-- 在元素中显示倒计时 -->
<p id="demo"></p>
<script>
// 设置倒计时的日期
var countDownDate = new Date("2030年1月5日 15:37:25").getTime();
// 每秒更新倒计时
var x = setInterval(function() {
// 获取今天的日期和时间
var now = new Date().getTime();
// 计算现在时间和倒计时日期之间的差值
var distance = countDownDate - now;
// 计算天数、小时、分钟和秒
var days = Math.floor(distance / (1000 * 60 * 60 * 24));
var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
var seconds = Math.floor((distance % (1000 * 60)) / 1000);
// 在 id="demo" 的元素中显示结果
document.getElementById("demo").innerHTML = days + "d " + hours + "h "
+ minutes + "m " + seconds + "s ";
// 如果倒计时结束,显示文本
if (distance < 0) {
clearInterval(x);
document.getElementById("demo").innerHTML = "已过期";
}
}, 1000);
</script>
自己尝试 »
提示: 在我们的 JavaScript 参考中了解更多关于 window.setInterval() 方法的信息。