当前位置：首页 > 日记 > 正文

js实现日期显示的一些操作 | 实例讲解

js实现日期显示的一些操作 | 实例讲解

1、js获取当前日期（yyyy-mm-dd）

以下代码是获取到的当前日期：

var myDate = new Date(); var year = myDate.getFullYear(); //获取完整的年份(4位,1970-????)var month = myDate.getMonth()+1;  //获取当前月份(1-12)var day = myDate.getDate();  //获取当前日(1-31)//获取完整年月日var newDay = year + “-” + month + “-” + day;

2、点击实现日期的天数加减（yyyy-mm-dd）

点击俩个按钮分别可以实现日期的加减，如果本月天数达到最多，那么月份将会自动增加或减少

var n = 0;dayChange(0)$("#time-add").click(function(){ n++; dayChange(n);})$("#time-less").click(function(){ n--; dayChange(n);})function dayChange(n){ var now = new Date();//今天 var tomo = new Date((now/1000+86400*n)*1000);//明天 var month = tomo.getMonth() + 1; var strDate = tomo.getDate();  var seperator1 = "-"; if (month >= 1 && month <= 9) {  month = "0" + month; } if (strDate >= 0 && strDate <= 9) {  strDate = "0" + strDate; } var currentdate = tomo.getFullYear() + seperator1 + month + seperator1 + strDate; $(".center-day").html(currentdate);}

3、获取当前本周周一和本周周日的时间范围

不管当前是周几，都可以获取到当前所在这一周的起始时间

var now = new Date();//今天 week(now);  function week(now){ var nowTime = now.getTime() ;  var day = now.getDay(); var oneDayLong = 24*60*60*1000 ;  //获取本周所在周一 var MondayTime = nowTime - (day-1)*oneDayLong ;  //获取本周所在周末      var SundayTime = nowTime + (7-day)*oneDayLong ;  //转化日期 var monday = new Date(MondayTime); var sunday = new Date(SundayTime); var month = monday.getMonth() + 1; var strDate = monday.getDate(); var month1 = sunday.getMonth() + 1; var strDate1 = sunday.getDate(); if (month >= 1 && month <= 9) {  month = "0" + month; } if (month1 >= 1 && month1 <= 9) {  month1 = "0" + month1; } if (strDate >= 0 && strDate <= 9) {  strDate = "0" + strDate; } if (strDate1 >= 0 && strDate1 <= 9) {  strDate1 = "0" + strDate1; } currentdate = monday.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + sunday.getFullYear() + seperator1 + month1 + seperator1 + strDate1; $(".center-day").html(currentdate);32}

4、点击实现每周范围的变化

点击改变的按钮将会改变显示一周范围的改变，如果有的在下一月或者下一年，那么将会自动显示，不会出现错误

var now = new Date();//今天var n = 0;week(now); $("#week-add").click(function(){ n++; var date = new Date(now.getTime() + n*7*24*3600*1000); week(date);})$("#week-add").click(function(){ n--; var date = new Date(now.getTime() + n*7*24*3600*1000); week(date);})function week(now){ var nowTime = now.getTime() ;  var day = now.getDay(); var oneDayLong = 24*60*60*1000 ; //获取本周所在周一 var MondayTime = nowTime - (day-1)*oneDayLong ; //获取本周所在周末      var SundayTime = nowTime + (7-day)*oneDayLong ; 22//转化日期 var monday = new Date(MondayTime); var sunday = new Date(SundayTime); var month = monday.getMonth() + 1; var strDate = monday.getDate(); var month1 = sunday.getMonth() + 1; var strDate1 = sunday.getDate(); if (month >= 1 && month <= 9) {  month = "0" + month; } if (month1 >= 1 && month1 <= 9) {  month1 = "0" + month1; } if (strDate >= 0 && strDate <= 9) {  strDate = "0" + strDate; } if (strDate1 >= 0 && strDate1 <= 9) {  strDate1 = "0" + strDate1; } currentdate = monday.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + sunday.getFullYear() + seperator1 + month1 + seperator1 + strDate1; $(".center-day").html(currentdate);}

5、获取当前月份的第一天和最后一天

能够获取到当前所在月份的第一天和最后一天，最后一天的日期是不固定的，能够获取到应有的日期

monthfen(0)function monthfen(n){　　var now = new Date();//今天　　var firstDate = new Date((now/1000+86400*n*now.getDate())*1000);//明天 //本月第一天　　firstDate.setDate(1); //第一天　　var date = new Date(firstDate);　 var month = date.getMonth() + 1;　　var strDate = "0" + date.getDate(); //本月最后一天　 var endDate = new Date(firstDate);　 endDate.setMonth(firstDate.getMonth()+1);　 endDate.setDate(0);　　var date1 = new Date(endDate);　 var month1 = date1.getMonth() + 1;　　var strDate1 = date1.getDate();　　if (month >= 1 && month <= 9) {　　　　month = "0" + month;　　}　　if (month1 >= 1 && month1 <= 9) {　　　　month1 = "0" + month1;　　}　　currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + date1.getFullYear() + seperator1 + month1 + seperator1 + strDate1;　　$(".center-day").html(currentdate);}

6、点击实现当前月份的改变

点击按钮会实现当前月份的改变，那么最后一天的日期也会自动改变，

monthfen(0)var n = 0;$("#month-add").click(function(){ n++; monthfen(n);})$("#month-less").click(function(){ n--; monthfen(n);})function monthfen(n){　　var now = new Date();//今天　　var firstDate = new Date((now/1000+86400*n*now.getDate())*1000);//明天//本月第一天　　firstDate.setDate(1); //第一天　　var date = new Date(firstDate);　 var month = date.getMonth() + 1;　 var strDate = "0" + date.getDate();//本月最后一天　　var endDate = new Date(firstDate);　　endDate.setMonth(firstDate.getMonth()+1);　　endDate.setDate(0);　　var date1 = new Date(endDate);　　var month1 = date1.getMonth() + 1;　　var strDate1 = date1.getDate();　　if (month >= 1 && month <= 9) {　　　　month = "0" + month;　　}　　if (month1 >= 1 && month1 <= 9) {　　　　month1 = "0" + month1;　　}　　currentdate = date.getFullYear() + seperator1 + month + seperator1 + strDate + "至" + date1.getFullYear() + seperator1 + month1 + seperator1 + strDate1;　　$(".center-day").html(currentdate);}

当然还有很多关于日期格式的改变和算法，如果有什么不理解的可以留下评论，大家一起探讨。

以上这篇js实现日期显示的一些操作(实例讲解)就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持。

操作日期显示实例电脑软件  

热门内容

相关文章

限时抢购优惠促销海报

限时抢购优惠促销海报

促销,优惠,海报,电脑软件，设计素描 uff1a 主要过程： 1。绘制一个矩形填充白色背景图层，使用多边形工具设置三角形，旋转，用形状工具调整，如图表。 2。三角形的多份复制成不同的角度和大小，如图。 3，椭圆工具在几个圆以下位置，如图所示 4，现在填充颜…

WPS文字如何给添加题注

WPS文字如何给添加题注

文字,题注,图片,电脑软件,WPS，　　文档中插入图片与表格是常有的事，给图片所加的题注，其作用可以在文章中找到相应的图片与表格。以下是小编为您带来的关于WPS文字给图片添加题注，希望对您有所帮助。WPS文字给图片添加题注简述首先选中需要加&…

Excel正负数用不同颜色显示的两种

Excel正负数用不同颜色显示的两种

显示,负数,两种,不同颜色,技巧，关于Excel里面正负数使用不同的颜色的表示两种方法，主要使用到了自定义格式和条件格式来实现。很多时候，我们为了更直观的查看数据，会在Excel里面使用不同颜色来区别正负数。如下面所示的D列，将正数用绿色表示，负…

ps如何将转换成画布的漫画效果

ps如何将转换成画布的漫画效果

转换成,如何将,效果,漫画,电脑软件，今天我们来看看使用PS制作漫画效果的教程，把图片转换成卡通人物非常简单。现在我们来看看最后的效果。 软件名称：Adobe PS图象处理软件8全绿色中文版软件大小：150.1mb更新时间：2015-11-04 步骤1、打开待处理…

wps表格怎么下移单元格wps表格下移

wps表格怎么下移单元格wps表格下移

方法,步骤,单元格,表格,电脑软件，　　在使用wps办公软件制作表格时，有时由于自己的疏忽大意，可能忘记了还有其它选项需要添加，这个时候就需要考虑下移单元格了，那么wps表格如何下移单元格呢?下面小编来告诉你下移单元格的方法吧。wps表格下移单…

Painter创建一个自定义的图像喷管

Painter创建一个自定义的图像喷管

图像,自定义,喷管,创建一个,电脑软件，Corel Painter图像喷管就像一支能够喷涂图像的画笔。跟随本教程循序渐进地了解如何创建您的自定义喷图，绘出已创建的图像。第一步是新建文档：&ldquo;文件&rdquo;-&ldquo;新建&rdquo;-&ldquo;200 x 200 15…

Oracle使用强制索引的方法与注意事

Oracle使用强制索引的方法与注意事

索引,方法,注意事项,电脑软件,Oracle，Oracle使用强制索引在一些场景下，可能ORACLE不会自动走索引，这时候，如果对业务清晰，可以尝试使用强制索引，测试查询语句的性能。以EMP表为例：先在EMP表中建立唯一索引，如图。普通搜索：SELECT * FROM EMP T查看…

React Native 搭建开发环境的方法

React Native 搭建开发环境的方法

方法,步骤,搭建开发环境,电脑软件,React，本文介绍了React Native 搭建开发环境，分享给大家，具体如下：准备工作 node -v：确认是否安装Node，若已经成功安装了，则执行下面的命令；否则先进行Node的安装。 npm install -g create-react-native-app：使…

ES6新数据结构Set与WeakSet用法分

ES6新数据结构Set与WeakSet用法分

数据结构,电脑软件,WeakSet,Set，本文实例讲述了ES6新数据结构Set与WeakSet用法。分享给大家供大家参考，具体如下：新数据结构Set与WeakSet1. SetSet类似于数据，但是成员值都是唯一的。生成Set的方式如下。var s = new Set();[1,1,3,3,5,5].map(…

PHP sleep | 函数, usleep | 函数

PHP sleep | 函数, usleep | 函数

函数,电脑软件,PHP,sleep,usleep，PHP sleep() 函数定义和用法sleep() 函数延迟代码执行若干秒。语法sleep(seconds)seconds 必需。以秒计的暂停时间。返回值若成功，返回 0，否则返回 false。错误／异常如果指定的描述 seconds 是负数，该函数将生…

HTTP 错误 401.1 - 未经授权：访问由

HTTP 错误 401.1 - 未经授权：访问由

无效,错误,凭据,未经授权,被拒，IUSR账号被禁用 症状举例： HTTP 错误 401.1 - 未经授权：访问由于凭据无效被拒绝。 原因分析： 由于用户匿名访问使用的账号是IUSR_机器名，因此如果此账号被禁用，将造成用户无法访问。 解决办法： 控制面板->管…

Photoshop高手人物处理视频教程

Photoshop高手人物处理视频教程

视频教程,人物,高手,电脑软件,Photoshop， 　　滤镜主要是用来实现图像的各种特殊效果。它在Photoshop中具有非常神奇的作用。滤镜的操作是非常简单的，但是真正用起来却很难恰到好处。滤镜通常需要同通道、图层等联合使用，才能取得…