JavaScript实现时间上一天和下一天切换

1、先获取时间戳毫秒数

  

var date = new Date()//实例化时间戳
var time = date.getTime()//获取当前毫秒数

  

2、计算一天的毫秒数/获取页面元素

   

var  OneDay = 1000 * 60 * 60 *24; //计算一天的毫秒数
var ele = document.getElementById("show");//获取页面元素

  

3、计算当前时间的前一天并调用渲染

function gobefore(){
var m=time-OneDay;
  //把毫秒数转为时间
date.setTime(m);
  //调用排版渲染到页面
ele.innerHTML=MyDate();
}

4、计算当前时间的后一天并调用渲染

 

function goafter(){
var m=time+OneDay;
  //把毫秒数转为时间
date.setTime(m);
  //调用排版渲染到页面
ele.innerHTML=MyDate();
}

5、排版需要时调用

function MyDate(){
  //年月日排版
return `${date.getFullYear()}年${date.getMonth()}月${date.getDate()}日`;
}

  

JavaScript实现时间上一天和下一天切换的更多相关文章

  1. vue 实现上一周、下一周切换功能

    效果图: html 显示部分: js 显示部分: preNextBtn(val){ let _this = this; this.tableList = []; //数据重置为空 _this.show ...

  2. React-Native 之 GD (十四)小时风云榜 及 当前时间操作 及 上一小时、下一小时功能实现

    1.小时风云榜 GDHourList.js /** * 小时风云榜 */ import React, { Component } from 'react'; import { StyleSheet, ...

  3. JavaScript如何实现上拉加载,下拉刷新?

    转载地址: 面试官:JavaScript如何实现上拉加载,下拉刷新? 一.前言 下拉刷新和上拉加载这两种交互方式通常出现在移动端中 本质上等同于PC网页中的分页,只是交互形式不同 开源社区也有很多优秀 ...

  4. js获取上一个月、下一个月格式为yyyy-mm-dd的日期

    /** * 获取上一个月 * * @date 格式为yyyy-mm-dd的日期,如:2014-01-25 */ function getPreMonth(date) { var arr = date. ...

  5. PHP中使用Session配合Javascript实现文件上传进度条功能

    Web应用中常需要提供文件上传的功能.典型的场景包括用户头像上传.相册图片上传等.当需要上传的文件比较大的时候,提供一个显示上传进度的进度条就很有必要了. 在PHP .4以前,实现这样的进度条并不容易 ...

  6. JavaScript基于时间的动画算法

    转自:https://segmentfault.com/a/1190000002416071 前言 前段时间无聊或有聊地做了几个移动端的HTML5游戏.放在不同的移动端平台上进行测试后有了诡异的发现, ...

  7. JavaScript设计模式-17.装饰者模式(下)

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  8. 详解JavaScript UTC时间转换方法

    这篇文章主要介绍了JavaScript UTC时间转换方法,介绍了本地时间到UTC时间的转换.UTC日期到本地日期的转换,感兴趣的小伙伴们可以参考一下 一.前言 1.UTC: Universal Ti ...

  9. JavaScript日期时间格式化函数

    这篇文章主要介绍了JavaScript日期时间格式化函数分享,需要的朋友可以参考下 这个函数经常用到,分享给大家. 函数代码: //格式化参数说明: //y:年,M:月,d:日,h:时,m分,s:秒, ...

随机推荐

  1. 使用conda部署jupyterhub以及ladp验证的安装

    前提:机器安装有conda环境 官方文档:http://jupyterhub.readthedocs.io/en/stable/quickstart.html 1.安装conda3 jupyterhu ...

  2. Django 与 Flask框架的比较

    Django Django恐怕是最有代表性的Python框架了.它是一个遵循MMVC架构模式的开源框架.它的名字来自Django Reinhardt,一个法国作曲家和吉他演奏家,很多人认为他是历史上最 ...

  3. sparksql笔记

    1.sparksql是Spark用来处理结构化数据的一个模块,它提供了两个抽象DataFrame和DataSet并且作为分布式SQL查询引擎的作用. Hive SQL转换成MapReduce然后提交到 ...

  4. UNP学习 多播

    一.概述 单播地址标识单个接口,广播地址标识子网上的所有接口,多播地址标识一组接口. 单播和广播是编址方案的两个极端,多播的目的就在于提供一种折衷的方案. 二.多播地址 我们必须区分IPv4多播地址和 ...

  5. 关于respond.js

    作用:可以让ie8及以下支持css3的媒体查询. 有几个问题: 1.由于浏览器的安全机制,Respond.js 不能在通过 file:// 协议(打开本地HTML文件所用的协议)访问的页面上发挥正常的 ...

  6. 【LeetCode 41】缺失的第一个正数

    题目链接 [题解] 先明确一点假设给的数字有n个. 那么最后的答案最情况下就是n+1 首先我们先判断一下所给的数组里面有没有1 如果没有直接返回1 否则. 把数组中所有的范围超过n或者小于1的数字全都 ...

  7. python 网络编程:socket(二)

    上节地址:Python网络编程:socket 一.send和sendall区别 send,sendall         ret = send('safagsgdsegsdgew') #send 发送 ...

  8. 接口测试——postman安装

    http://www.jianshu.com/p/dd0db1b13cfc postman的视频终于过审了,https://ke.qq.com/course/229839#tuin=1eb87ef,大 ...

  9. [CSP-S模拟测试45]题解

    开局一行$srand$,得分全靠随机化. A.kill 发现两个并不显然的性质: 1.选中的人和怪物一定是按顺序的.第一个人打所有被选中怪物的第一只,第二个人打第二只,$etc$. 2.最优方案打的怪 ...

  10. JS-监听整个页面上的DOM树变化

    # [在线预览](https://jsfiddle.net/1010543618/fyf913t0/) ## 方法 - 使用<Web API 接口>的<MutationObserve ...