1.给定任意一个时间,然后实现现在到那个时间的倒计时。

下面的例子是显示现在到2021年1月1号0时0分的倒计时:

function showTime() {
//获取目的日期
var myyear = 2021; //年
var mymonth = 1 - 1; //月 只需要填写 - 前面的数字,这里是八月
var myday = 0; //天
var myhour = 00; //时
var myminute = 00; //分
var mysecond = 00; //秒
//以上综合填入的时间是 2021年1月1号0时0分;
var time = Number(new Date(myyear, mymonth, myday, myhour, myminute, mysecond));
// var time=new Date(myyear,mymonth,myday,myhour,myminute,mysecond).getTime();
//获取当前时间
var nowTime = Date.now();
// var nowTime = new Date().getTime();
//获取时间差
var timediff = Math.round((time - nowTime) / 1000);
//获取还剩多少天
var day = parseInt(timediff / 3600 / 24);
//获取还剩多少小时
var hour = parseInt(timediff / 3600 % 24);
//获取还剩多少分钟
var minute = parseInt(timediff / 60 % 60);
//获取还剩多少秒
var second = timediff % 60;
//输出还剩多少时间
console.log(timerFilter(day)+"天"+timerFilter(hour)+"时"+timerFilter(minute)+"分"+timerFilter(second)+"秒")
setTimeout(showTime, 1000); //给小于10的数值前面加 0
function timerFilter(params) {
if (params - 0 < 10) {
return '0' + params
} else {
return params
}
} }

2.当前时间到当天23:59:59倒计时。(按F12在控制台执行函数就可以见到效果)

function showLeft() {
//获取当前时间
var nowTime = Date.now();
// var nowTime = new Date().getTime();
//获取当天 23:59
var endTime = new Date(new Date().toLocaleDateString()).getTime() + 24 * 60 * 60 * 1000 - 1
//获取时间差
var timediff = Math.round((endTime - nowTime) / 1000);
//获取还剩多少小时
var hour = parseInt(timediff / 3600 % 24) + parseInt(timediff / 3600 / 24) * 24;
//获取还剩多少分钟
var minute = parseInt(timediff / 60 % 60);
//获取还剩多少秒
var second = timediff % 60;
//输出还剩多少时间
hour = timerFilter(hour);
minute = timerFilter(minute);
second = timerFilter(second); console.log(hour + "时" + minute + "分" + second + "秒")
setTimeout(showLeft, 1000); //给小于10的数值前面添加 0
function timerFilter(params) {
if (params - 0 < 10) {
return '0' + params
} else {
return params
}
}
}

js网页倒计时功能(天,时,分,秒)的更多相关文章

  1. js倒计时demo 天/时/分/秒

    <html><head> <meta charset="UTF-8"> <title>js简单时分秒倒计时</title> ...

  2. JS实现倒计时(天数,时,分,秒)

    <!DOCTYPE html> <html> <head>   <meta charset="utf-8" >   <titl ...

  3. js网页倒计时精确到秒级

    网页实时倒计时,精确到秒级,和天数倒计时原理一样. 一个很好用的js倒计时!网页实时倒计时,精确到秒级,和天数倒计时原理一样.js倒计时一般用于商城网站团购,特卖,很多地方都可用到!希望能够给大家带来 ...

  4. (转)js实现倒计时效果(年月日时分秒)

    原文链接:http://mengqing.org/archives/js-countdown.html 之前做的活动页面很多都用到了倒计时功能,所以整理下下次直接用.(用的是张鑫旭写的一个倒计时,稍作 ...

  5. jQuery UI Datepicker&Datetimepicker添加 时-分-秒 并且,判断

    jQuery UI Datepicker时间(年-月-日) 相关代码: <input type="text" value="" name="ad ...

  6. 网页倒计时,动态显示"××年还剩××天××时××分××秒"

    var target = document.getElementById('target'); function getTimeString(){ // 要计算任意两个日期的时间差只要修改curren ...

  7. JavaScript/js把秒或者毫秒换算成xx-xx-xx 时-分-秒的形式

    function MillisecondToDate(msd) { // var time = parseFloat(msd) / 1000; var time=msd; if (null != ti ...

  8. js计算两个时间差 天 时 分 秒 毫秒

    // 计算两个时间差 dateBegin 开始时间 function timeFn(dateBegin) { //如果时间格式是正确的,那下面这一步转化时间格式就可以不用了 var dateEnd = ...

  9. JS将秒转换为 天-时-分-秒

    记录一下,备忘.. function SecondToDate(msd) { var time =msd if (null != time && "" != tim ...

随机推荐

  1. 【Aizu - 0121】Seven Puzzle (反向bfs)

    -->Seven Puzzle 原文是日语 这里就直接写中文了  Descriptions: 7拼图由8个正方形的卡和这些卡片完全收纳的框构成.每张卡都编号为0, 1, 2, …, 7,以便相互 ...

  2. java字符串的替换replace、replaceAll、replaceFirst的区别

    看代码: String s = "my.test.txt"; System.out.println(s.replace(".", "#")) ...

  3. Bzoj 3126[Usaco2013 Open]Photo 题解

    3126: [Usaco2013 Open]Photo Time Limit: 10 Sec  Memory Limit: 128 MBSubmit: 335  Solved: 169[Submit] ...

  4. Prim算法与Kruskal(没有代码)

    两个最小生成树算法, 都有一个共同的思想: 这棵树是一点一点长大的; 并且每次生长, 都是贪心的. 不同之处是: Kruscal算法是以边为中心的, 每次找最小的并且有用的边添加到树上; Prim算法 ...

  5. Excel催化剂开源第25波-Excel调用百度AI,返回AI结果

    现成的这些轮子,无需调用网页,直接本地离线即可生成). 当然在AI时代,少不了各种AI接口的使用场景,普通开发者只需聚焦在自己的业务场景上,这些AI底层技术,只需类似水煤电一般去BAT这些大厂那里去消 ...

  6. 《ElasticSearch6.x实战教程》之复杂搜索、Java客户端(下)

    第八章-复杂搜索 黑夜给了我黑色的眼睛,我却用它寻找光明. 经过了解简单的API和简单搜索,已经基本上能应付大部分的使用场景.可是非关系型数据库数据的文档数据往往又多又杂,各种各样冗余的字段,组成了一 ...

  7. 【HDOJ】2007平方和与立方和

    Problem Description 给定一段连续的整数,求出他们中所有偶数的平方和以及所有奇数的立方和.   Input 输入数据包含多组测试实例,每组测试实例包含一行,由两个整数m和n组成.   ...

  8. MYSQL主从复制、主主复制、双主多从配置

    一.如何配置MYSQL的主从复制? 1. 两台数据库服务器,IP分别为 192.168.216.128 和 192.168.216.129,在服务器上装MYSQL(我的配置版本为5.5.56) 2. ...

  9. Aspnet Mvc 前后端分离项目手记(四)vue项目的搭建(一)(iview)

    一项目创建 1,搭建vue-cli脚手架(依赖npm) 没有安装npm的同学,请先使用npm install -g vue-cli ,然后再进行这一步 安装的过程中有几项 ? Project name ...

  10. 史上最全IO流详解,看着一篇足矣

    一:要了解IO,首先了解File类 File类里面的部分常量,方法 No. 方法或常量 类型 描述 1 public static final String pathSeparator 常量 表示路径 ...