跨境派

跨境派

跨境派,专注跨境行业新闻资讯、跨境电商知识分享!

当前位置:首页 > 卖家故事 > JS新年倒计时

JS新年倒计时

时间:2024-04-06 08:20:43 来源:网络cs 作者:利杜鹃 栏目:卖家故事 阅读:

标签: 新年 
阅读本书更多章节>>>>

在这里插入图片描述

✅作者简介:热爱国学的Java后端开发者,修心和技术同步精进。
🍎个人主页:Java Fans的博客
🍊个人信条:不迁怒,不贰过。小知识,大智慧。
💞当前专栏:前端案例分享专栏
✨特色专栏:国学周更-心性养成之路
🥭本文内容:JS新年倒计时
更多内容点击👇
       JavaScript—实现手风琴画册

在这里插入图片描述

  不知不觉,2022年就进入了倒计时!十二月有太多的盼头了,平安夜,圣诞节,第一场雪,跨年倒计时,春节,当然,还有你们!那么我们离每一个日子都有多少天呢?下面我将分享一个我们中国人的传统节日——春节的倒计时吧。其他的时间,可以根据这个方法进行修改计算。

运行效果:
在这里插入图片描述

源码分享:

<!DOCTYPE html><html><head><meta charset="utf-8"><title></title><style>div{width: 300px;height: 100px;background-color: aquamarine;margin: 50px auto;text-align: center;line-height: 100px;border:1px solid black;border-radius: 100px;}button{width: 100px;height: 30px;margin: 0 auto;margin-left: 50%;}</style></head><body><div></div><script>var divEle=document.querySelector('div');dateTimes();//封装时间的函数function dateTimes(){// 获取2023年春节到1970年的毫秒数var date2023=new Date(2023,0,22,0,0,0);var ms2023=date2023.getTime();var myVar=setInterval(dateTimes,1000);var date=new Date();//获取当前时间到1970年的毫秒数var msCurrent=date.getTime();//时间差:总毫秒数var timeSc=ms2023-msCurrent;//倒计时:天,时,分,秒//获取 天var dateDays=Math.floor(timeSc/(1000*60*60*24));//去掉天数剩余的毫秒数timeSc=timeSc%(1000*60*60*24);console.log(timeSc);//获取 时var dateHours=Math.floor(timeSc/(1000*60*60));//去掉时剩余的毫秒数timeSc=timeSc%(1000*60*60);console.log(timeSc);//获取 分var dateMinutes=Math.floor(timeSc/(1000*60));//去掉分剩余的毫秒数timeSc=timeSc%(1000*60);console.log(timeSc);//获取 秒var dateSeconds=Math.floor(timeSc/1000);if(parseInt(dateHours)<10){dateHours='0'+dateHours;}if(parseInt(dateMinutes)<10){dateMinutes='0'+dateMinutes;}if(parseInt(dateSeconds)<10){dateSeconds='0'+dateSeconds;}var dateStr="新年倒计时:"+dateDays+'天'+dateHours+"时"+dateMinutes+"分"+dateSeconds+"秒";divEle.innerText=dateStr;}</script></body></html>

其他倒计时:修改 var date2023=new Date(2023,0,22,0,0,0); 即可,值得注意的是,1月用数字0表示

平安夜倒计时:var date2023=new Date(2022,11,24,0,0,0);圣诞节倒计时:var date2023=new Date(2022,11,25,0,0,0);元旦倒计时:var date2023=new Date(2023,0,1,0,0,0);

其他知识快捷链接:时间日期:Date对象


  码文不易,本篇文章就介绍到这里,如果想要学习更多Java系列知识点击关注博主,博主带你零基础学习Java知识。与此同时,对于日常生活有困扰的朋友,欢迎阅读我的第四栏目:《国学周更—心性养成之路》,学习技术的同时,我们也注重了心性的养成。

在这里插入图片描述

阅读本书更多章节>>>>

本文链接:https://www.kjpai.cn/gushi/2024-04-06/154646.html,文章来源:网络cs,作者:利杜鹃,版权归作者所有,如需转载请注明来源和作者,否则将追究法律责任!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容,一经查实,本站将立刻删除。

文章评论