使用js写简易的倒计时
步骤
1.获取span标签
2.获取现在的时间戳
3.获取未来的时间戳
4.将未来时间戳减去现在的时间戳等于相差的秒数
5.输出到页面
直接上代码
<span name="os">00d 00h 00m 00s</span>
<script>
// 获取span标签
osp = document.getElementsByName("os")[0]; // 一位数字的时候在前面加个0
function tow(n) {
return n >= 0 && n < 10 ? "0" + n : n;
} function getDate(){
// 获取现在的时间戳
var nowdate = new Date();
// 获取时间戳的毫秒数
var nowtime = nowdate.getTime(); // 获取未来的时间戳
var newdate = new Date("2020/1/11 18:00:00");
var newtime = newdate.getTime(); // 将未来时间戳减去现在的时间戳等于相差的秒数
var second = Math.floor((newtime - nowtime)/1000); // 一天等于86400秒,所以将相差的秒数除以86400等于剩余天数(math.floor向下取整)
var day = Math.floor(second/86400);
// 将秒数取余86400,等于剩余秒数
second %= 86400; // 一小时等于3600秒,所以将相差的秒数除以3600等于剩余小时(math.floor向下取整)
var hour = Math.floor(second/3600);
second %= 3600; var minute = Math.floor(second/60);
second %= 60; var ost = tow(day) + "d " + tow(hour) + "h " + tow(minute) + "m " + tow(second) + "s";
osp.innerHTML = ost;
}
getDate();
setInterval(getDate,1000); </script>
运行结果
使用js写简易的倒计时的更多相关文章
- Javascript基础示例:用JS写简易版贪吃蛇(面向对象)
废话不多说,代码如下: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> & ...
- js写的5秒钟倒计时跳转
使用js实现几秒以后倒计时跳转,这个在某些特殊情况下还是比较实用的,下面为大家介绍下具体的实现步骤,感兴趣的朋友不要错过 代码如下: <html> <head> < ...
- 使用Node.js实现简易MVC框架
在使用Node.js搭建静态资源服务器一文中我们完成了服务器对静态资源请求的处理,但并未涉及动态请求,目前还无法根据客户端发出的不同请求而返回个性化的内容.单靠静态资源岂能撑得起这些复杂的网站应用,本 ...
- [转] 使用Node.js实现简易MVC框架
在使用Node.js搭建静态资源服务器一文中我们完成了服务器对静态资源请求的处理,但并未涉及动态请求,目前还无法根据客户端发出的不同请求而返回个性化的内容.单靠静态资源岂能撑得起这些复杂的网站应用,本 ...
- 原生JS实现简易轮播图
原生JS实现简易轮播图(渐变?) 最近做网页总是会用到轮播图,我就把之前写的轮播图单独拿出来吧,如果有...如果真的有人也需要也可以复制去用用啊..哈~.. window.onload = funct ...
- 面试题之(js实现当年剩余时间倒计时程序)
js实现当年剩余时间倒计时程序,请看代码: <script> function counter() { var date = new Date(); var year = date.get ...
- node.js 开发简易的小爬虫
node.js 开发简易的小爬虫 最近公司开发一款医药类的软件,所以需要一些药品的基础数据,所以本人就用node.js写一个简易的小爬虫,并写记录这个Demo以供大家参考. 一.开发前的准备: 1, ...
- 原生JS实现简易随机点名功能
定时器的工作原理,这里将用引用How JavaScript Timers Work中的例子来解释定时器的工作原理,该图为一个简单版的原理图.· 上图中,左侧数字代表时间,单位毫秒:左侧文字代表某一个操 ...
- Node.js写文件的三种方法
Node.js写文件的三种方式: 1.通过管道流写文件 采用管道传输二进制流,可以实现自动管理流,可写流不必当心可读流流的过快而崩溃,适合大小文件传输(推荐) var readStream = fs. ...
随机推荐
- Nginx 配置文件优化
user www www; #用户&组 worker_processes auto; #通常是CPU核的数量存储数据的硬盘数量及负载模式,不确定时将其设置为可用的CPU内核数(设置为“auto ...
- spring boot jpa 整合
1,Eclipse JPA Tool配置 https://www.cnblogs.com/wgslucky/p/10109300.html 2,项目地址 https://gitee.com/wgslu ...
- 文件 "c:\Program Files\Microsoft SQL Server\MSSQL10.SQLEXPRESS\MSSQL\DATA\ttt.mdf" 已压缩,但未驻留在只读数据库或文件组中。必须将此文件解压缩。 CREATE DATABASE 失败。无法创建列出的某些文件名。请查看相关错误。 (.Net SqlClient Data Provider)
问题: 文件 "c:\Program Files\Microsoft SQL Server\MSSQL10.SQLEXPRESS\MSSQL\DATA\ttt.mdf" 已压缩,但 ...
- PKCS RSA执行标准
RSA是一种算法,但是,在相关应用的时候,还是需要有一些标准的.这就是pkcs.现在的各种程序中,基本都是遵循这个标准来使用RSA的.最近陆续读取RSA相关的内容进行学习. RSA官网:https:/ ...
- 2018-2019-2 网络对抗技术 20165335 Exp4 恶意代码分析
实验内容: 一.使用schtacks进行系统运行监控,使用sysmon工具监控系统的具体进程,使用各种工具进行监控,并针对软件的启动回连,安装到目标机,以及其他的控制行为的分析,同时,对主机的注册表, ...
- Jupyter Notebooks 是数据科学/机器学习社区内一款非常流行的工具
Jupyter Notebooks 是数据科学/机器学习社区内一款非常流行的工具.Jupyter Notebooks 允许数据科学家创建和共享他们的文档,从代码到全面的报告都可以.李笑来 相当于拿他来 ...
- dlo,学习清单
肥文自动机 模拟纵火 替罪羊 法法塔 ntt
- Go语言文件操作
打开和关闭文件 os.Open()函数能够打开一个文件,返回一个*File和一个err. file.close()方法能够关闭文件. //打开和关闭文件 func main() { file,err ...
- SNMP理解
前两天项目要求一个附加功能,远程监视服务器的运行状况,要定期监视指定端口,指定业务,还包括服务器的磁盘空间,内存,CPU使用率等等.这头俩事还好说,ping和telnet也就搞定了,实在不行就开个so ...
- POI兴趣点搜索 - 地理信息系统(6)
(2017-08-13 银河统计) POI(Point of Interest),中文可以翻译为"兴趣点",兴趣点(POI)是地理信息系统中的一个术语,泛指一切可以抽象为点的地理对 ...