功能要求：设定一个24小时的倒计时，并实时展示倒计时剩余时间
## 效果展示
## 代码实现：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>24小时倒计时</title>
<style type="text/css">* { margin: 0; padding: 0; }</style>
</head>
<body onload="timer()">
<!-- 倒计时 -->
<div id="time" style="width: 300px; height: 200px; background-color:#ccc; text-align: center; line-height: 200px"></div>
<!-- 脚本 -->
<script type="text/javascript"> //定义一个函数，用来获取当前的日期和时间 function getTime(){ var date = new Date(); var year = date.getFullYear(); var month = date.getMonth()+1; //0表示1月，11表示12月 if(month<10){ month = "0" + month ;//如果是个位数，则在前面加上‘0’ } var day = date.getDate();//返回的是当天是这个月的几号 if(day<10){ day = "0" + day ;//如果是个位数，则在前面加上‘0’ } var hour=date.getHours(); //返回小时数 if(hour<10){ hour = "0" + hour ;//如果是个位数，则在前面加上‘0’ } var minute=date.getMinutes(); //返回分钟数 if(minute<10){ minute = "0" + minute ;//如果是个位数，则在前面加上‘0’ } var second=date.getSeconds(); //返回秒数 if(second<10){ second = "0" + second ;//如果是个位数，则在前面加上‘0’ } return year+'-'+month+'-'+day+' '+hour+':'+minute+':'+second; } function timer(){ document.getElementById("time").innerHTML= getTime() + "<br /> 距 24 小时后的今天还有"; setInterval("document.getElementById('time').innerHTML= getTime() + '<br /> 距 24 小时后的今天还有';",1000); //setInterval("要执行的代码","执行间隔") let end_time=(new Date().valueOf())+(24*60*60*1000); //得出24小时后的总共多少ms setInterval('ShowCountDown(end_time)', 1000); //setInterval("要执行的代码","执行间隔") ShowCountDown(end_time); }; function ShowCountDown (end_time) { let now_timestamp=(new Date().valueOf()); let leftsecond=(end_time - now_timestamp)/1000; d=parseInt((leftsecond / 3600) / 24); h=parseInt((leftsecond / 3600) % 24); m=parseInt((leftsecond / 60) % 60); s=parseInt(leftsecond % 60 ); document.getElementById("time").innerHTML+=d + ' 天 ' + h + ' 时 ' + m + ' 分 ' + s 秒'; }; </script> </body> </html>
创作工场
免责声明：
以上内容除特别注明外均来源于网友提问，创作工场回答，未经许可，严谨转载。
点击这里>>使用🔥专业版，更聪明、更完整、更原创！