js-时间对象实现倒计时效果
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<script type="text/javascript">
window.onload = function(){
//倒计时原理 时间差 = 未来时间 - 当前时间
//设置未来时间
var future = new Date(2020,10,11,0,0,0);//注月份0-11
// console.log(future)
var current = null;//当前时间
var hh = document.querySelector('h1');
setInterval(function(){
current = new Date();//每1s获取一次
var len = future - current; //获得时间差
// console.log(len)
//毫秒转换成秒为单位进行计算
len /= 1000;
//天 86400 = 60*60*24
var d = parseInt(len / 86400);
//小时 秒 % 天 / 小时
var h = parseInt(len % 86400 / 3600);
//分 秒 % 小时 / 分
var m = parseInt(len % 3600 / 60);
//秒 秒 % 分
var s = parseInt(len % 60);
hh.innerText = '当前时间距离2020双十一还有'+d+'天'+zero(h)+'小时'+zero(m)+'分'+zero(s)+'秒'
},1000);
function zero(n){
return n<10 ? '0'+ n : n;
}
}
</script>
</head>
<body>
<h1></h1>
</body>
</html>
本文来自博客园，作者：JackieDYH，转载请注明原文链接：https://www.cnblogs.com/JackieDYH/p/17634797.html
【推荐】国内首个AI IDE，深度理解中文开发场景，立即下载体验Trae
【推荐】编程新体验，更懂你的AI，立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包，你的智能百科全书，全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell：AI 加持，快人一步
· Manus爆火，是硬核还是营销？
· 终于写完轮子一部分：tcp代理 了，记录一下
· 别再用vector＜bool＞了！Google高级工程师：这可能是STL最大的设计失误
· 单元测试从入门到精通
· 震惊！C++程序真的从main开始吗？99%的程序员都答错了