<!DOCTYPE html>

<html>

	<head>

		<meta charset="UTF-8">

		<title></title>

	</head>

	<body>

		<span id="time"></span>

		<script>

			//倒计时

			!(function() {

				var time = document.querySelector("#time");

				var oldtime = new Date(); //传入的时间

				oldtime = oldtime.setDate(oldtime.getDate() + 1);//模拟24小时后的时间

				//时间换算

				function timer(oldtime) {

					var newtime = new Date();

					var time = (oldtime - newtime) / 1000;

					var d = parseInt(time / (60 * 60 * 24));

					var h = parseInt(time / 60 / 60 % 24);

					var m = parseInt(time / 60 % 60);

					var s = parseInt(time % 60);

					return d + "天" + h + "小时" + m + "分钟" + s + "秒";

				}

				setInterval(function(){
                    　　　　　　　　time.innerHTML = timer(oldtime);
                　　　　　　　　　　}, 1000)

			})()

		</script>

	</body>

</html>

js模拟24小时的倒计时效果的更多相关文章

  1. js 模拟QQ聊天窗口图片播放效果（带滚轮缩放）

    页面效果如下: 完整代码如下: <!DOCTYPE html> <html> <head> <title>Test</title> < ...

  2. js模拟jq获取id

    js模拟jq获取id: (jquery)需要自己添加 <!DOCTYPE html> <html lang="en"> <head> <m ...

  3. JS模拟下拉框select

    最近做的一个项目有下拉框 同事都是用的是美化控件,但是用美化控件当然是好 但是网上找的一个控件不知道扩展性怎么样?对以后的维护会不会造成有影响?比如我想增加一个功能或者减少一个功能会不会影响?还有就是 ...

  4. js实现倒计时效果

    <!DOCTYPE html><head><meta http-equiv="Content-Type" content="text/htm ...

  5. 二、JavaScript语言--JS实践--倒计时效果

    主要内容:分析不同倒计时效果的计算思路及方法,掌握日期对象Date,获取时间的方法,计算时差的方法,实现不同的倒时计效果. Javascript 日期对象: Date()返回当前的日期和时间 getY ...

  6. 纯js倒计时效果（交流加群：452892873）（本群每天都更新学习资料）

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  7. 页面倒计时跳转页面效果，js倒计时效果

    页面倒计时跳转页面效果,js倒计时效果 >>>>>>>>>>>>>>>>>>>> ...

  8. 通过JS模拟select表单，达到美化效果[demo][转]

    转自: http://www.cnblogs.com/dreamback/p/SelectorJS.html 通过JS模拟select表单,达到美化效果 Demo ------------------ ...

  9. 通过JS模拟select表单，达到美化效果[demo]

    .m-form{background:#fff;padding:50px;font-family:12px/1.5 arial,\5b8b\4f53,sans-serif;} .m-form ul,. ...

随机推荐

  1. CVE-2018-19824漏洞学习

    简介 在Linux内核4.19.6之前,本地用户可以通过在Sound / USB /card.c.的usb_audio_probe中错误处理一个恶意USB声音设备(没有接口)来利用ALSA驱动程序中的 ...

  2. nohup重定向到其它的日志文件

    如果使用nohup命令提交作业,那么在缺省情况下该作业的所有输出都被重定向到一个名为nohup.out的文件中,除非另外指定了输出文件: nohup command > myout.file 2 ...

  3. iis 8.0 HTTP 错误 404.3 server 2012

    最近在学习WCF,发现将网站WCF服务放到IIS上时不能正常运行,从网上搜了一下: 解决方法,以管理员身份进入命令行模式,运行: "%windir%\Microsoft.NET\Framew ...

  4. 三、redis学习(jedis连接池)

    一.jedis连接池 二.jedis连接池+config配置文件 三.jedis连接池+config配置文件+util工具类 util类 public class JedisPoolUtils { / ...

  5. java知识点复习(1):

    1.java整形变量078:在java数字里数字表达式前面加上0表示8进制,因为8进制里表示数字只有0-7,所以这里的表达式有错误.相对而言,077就是合法的,转换成10进制就是63(7*8+7=63 ...

  6. html5_禁止复制网站内容

    ```//若是你不想别人复制你的网站内容,可以把这段js代码加到你网页上,即可屏蔽鼠标右键菜单.复制粘贴.选中等 有时候的需求是网站中有些内容不希望别人复制,那么就需要用代码控制.方法有多种:第一种: ...

  7. 浏览器进程线程时间循环、与vue netTick的实现原理

    浏览器事件循环(结合vue nextTick)https://juejin.im/post/5cb736c5f265da039955d4e8#comment messageChanel的讲解https ...

  8. call，apply，bind的理解

    call,apply,bind均是用于改变this指向. 三者相似之处: 1:都是用于改变函数的this指向. 2:第一个参数都是this要指向的对象. 3:都可以通过后面的参数进行对方法的传参. l ...

  9. python 安装时，为何pip install不是内部或者外部命令错误解决办法

    新安装的python 环境,第一次pip  install 却报不是内部或者外部命令错误 首先检查一下环境变量,可能时你没有设置环境变量 再说一遍,安装python环境时,记得出了python.exe ...

  10. MyCat配置简述以及mycat全局ID

    Mycat可以直接下载解压,简单配置后可以使用,主要配置项如下: 1. log4j2.xml:配置MyCat日志,包括位置,格式,单个文件大小 2. rule.xml: 配置分片规则 3. schem ...