js实现在html5页面显示倒计时(天时分秒)

最新推荐文章于 2025-05-29 14:47:07 发布

转载最新推荐文章于 2025-05-29 14:47:07 发布 · 7.5k 阅读

js 专栏收录该内容

2 篇文章

订阅专栏

本文介绍了一种使用JavaScript实现网页倒计时的方法。通过设定截止日期，页面将实时更新显示剩余时间，包括天数、小时、分钟及秒数。此功能适用于活动倒计时等场景。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

html代码(简化)：

<b id="time_b"></b>

js代码:

function ShowCountDown(jztime,divname) {
    var now = new Date();
    var endDate = new Date(Date.parse(jztime.replace(/-/g, "/")));
    var leftTime=endDate.getTime()-now.getTime();
    var leftsecond = parseInt(leftTime/1000);
    var day1=Math.floor(leftsecond/(60*60*24));
    var hour=Math.floor((leftsecond-day1*24*60*60)/3600);
    var minute=Math.floor((leftsecond-day1*24*60*60-hour*3600)/60);
    var second=Math.floor(leftsecond-day1*24*60*60-hour*3600-minute*60);
    if(day1 < 10){day1 = "0"+day1;}
    if(hour < 10){hour = "0"+hour;}
    if(minute < 10){minute = "0"+minute;}
    if(second < 10){second = "0"+second;}
    var cc = document.getElementById(divname);
    cc.innerHTML = "剩余：<em class='wxmr4'>"+day1+"</em>天<em class='wxml4'>"+hour+"</em>：<em>"+minute+"</em>：<em>"+second+"</em>";
}
var engTime = "2018-5-2";//截止时间
window.setInterval(function(){ShowCountDown(engTime,'time_b');}, 1000);