JS获取日期的方法实例【昨天,今天,明天,前n天,后n天的日期】


Posted in Javascript onSeptember 28, 2017

本文实例讲述了JS获取日期的方法。分享给大家供大家参考,具体如下:

原理很简单,一天的时间的毫秒数是1000*60*60*24,

前n天的日期就是现在日期换成毫秒-n*1000*60*60*24。

再把这个值换成日期即可(通过setTime方法)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
 <title>3water.com 日期计算</title>
 <meta name="Generator" content="EditPlus">
 <meta name="Author" content="">
 <meta name="Keywords" content="">
 <meta name="Description" content="">
 </head>
 <body>
 <select id="num" name="num" style="width:150px" onchange="ff()">
        <option value="-1">昨天</option>
        <option value="0">今天</option>
        <option value="1">明天</option>
 </select><br>
 <textarea id="ar" rows="3" cols="20">
 haha
</textarea>
<br/>
<input type="text" value="" name="bday" id="bday"/>天之前
<input type="button" onclick="bday()" value="计算"><br/>
<input type="text" value="" name="aday" id="aday"/>天之后
<input type="button" onclick="aday()" value="计算"><br/>
 </body>
 <script>
 ff();
function ff(){
 var obj=document.getElementById("num");
 var v1=obj.options[obj.selectedIndex].text;
 var v2=obj.options[obj.selectedIndex].value;
 var tvv=giveDateStr(getTargetday(v2));
 document.getElementById('ar').innerText=tvv;
}
function isInteger(obj) {
 var r = /^\+?[1-9][0-9]*$/;//正整数 
 return r.test(obj); 
}
function bday(){
 var bef=document.getElementById("bday").value;
 if(isInteger(bef)){
   var bvv=giveDateStr(getTargetday(-bef));
   document.getElementById('ar').innerText=bvv;
 }else{
   alert("请输入正整数!");
   document.getElementById("bday").value='';
   document.getElementById("bday").focus();
 }
 
}
function aday(){
 var atf=document.getElementById("aday").value;
 if(isInteger(atf)){
   var avv=giveDateStr(getTargetday(atf));
   document.getElementById('ar').innerText=avv;
 }else{
   alert("请输入正整数!");
   document.getElementById("aday").value='';
   document.getElementById("aday").focus();
 }
}
function getTargetday(num){
  var number=null;
  if(num==null||num==0){
   number=0;
  }else{
    number=num;
  }
  var  today=new  Date();
  var  targetday_milliseconds=today.getTime()+1000*60*60*24*number;
  var  targetday=new  Date();
  targetday.setTime(targetday_milliseconds); //注意,这行是关键代码
  return targetday;
}
function giveDateStr(dd){
  var riqiyue=dd.getMonth()+1;
  var riqihao=dd.getDate();
  var riqixingqi=null;
  if(dd.getDay()=='0'){
   xingqi="星期日";
  }else if(dd.getDay()=='1'){
   xingqi='星期一';
  }else if(dd.getDay()=='2'){
   xingqi='星期二';
  }else if(dd.getDay()=='3'){
   xingqi='星期三';
  }else if(dd.getDay()=='4'){
   xingqi='星期四';
  }else if(dd.getDay()=='5'){
   xingqi='星期五';
  }else if(dd.getDay()=='6'){
   xingqi='星期六';
  }
  var riqi=riqiyue+"月"+riqihao+"日"+"("+xingqi+")";
  return riqi;
}
</script>
</html>

运行效果如下:

JS获取日期的方法实例【昨天,今天,明天,前n天,后n天的日期】

PS:这里再为大家推荐几款比较实用的天数计算在线工具供大家使用:

在线日期/天数计算器:
http://tools.3water.com/jisuanqi/date_jisuanqi

在线日期计算器/相差天数计算器:
http://tools.3water.com/jisuanqi/datecalc

在线日期天数差计算器:
http://tools.3water.com/jisuanqi/onlinedatejsq

在线天数计算器:
http://tools.3water.com/jisuanqi/datejsq

希望本文所述对大家JavaScript程序设计有所帮助。

Javascript 相关文章推荐
Jquery模仿Baidu、Google搜索时自动补充搜索结果提示
Dec 26 Javascript
javascript下拉框选项单击事件的例子分享
Mar 04 Javascript
只需五句话搞定JavaScript作用域(经典)
Jul 26 Javascript
微信小程序 POST请求(网络请求)详解及实例代码
Nov 16 Javascript
JavaScript队列的应用实例详解【经典数据结构】
Apr 12 Javascript
vue中引用阿里字体图标的方法
Feb 10 Javascript
Vue刷新修改页面中数据的方法
Sep 16 Javascript
vue实现多条件和模糊搜索功能
May 28 Javascript
微信小程序如何引用外部js,外部样式,公共页面模板
Jul 23 Javascript
vue双击事件2.0事件监听(点击-双击-鼠标事件)和事件修饰符操作
Jul 27 Javascript
vue 实现element-ui中的加载中状态
Nov 11 Javascript
vue el-table实现递归嵌套的示例代码
Aug 14 Vue.js
jquery实现左右轮播图效果
Sep 28 #jQuery
bootstrap table实现点击翻页功能 可记录上下页选中的行
Sep 28 #Javascript
JavaScript判断输入是否为数字类型的方法总结
Sep 28 #Javascript
详解Node全局变量global模块
Sep 28 #Javascript
React Native预设占位placeholder的使用
Sep 28 #Javascript
import与export在node.js中的使用详解
Sep 28 #Javascript
AngularJS 仿微信图片手势缩放的实例
Sep 28 #Javascript
You might like
PHP中调用JAVA
2006/10/09 PHP
thinkphp中html:list标签传递多个参数实例
2014/10/30 PHP
PHP 自动加载的简单实现(推荐)
2016/08/12 PHP
PHP实现类似于C语言的文件读取及解析功能
2017/09/01 PHP
PHP与Perl之间知识点区别整理
2019/03/19 PHP
3款实用的在线JS代码工具(国外)
2012/03/15 Javascript
js 动态为textbox添加下拉框数据源的方法
2014/04/24 Javascript
js实现的下拉框二级联动效果
2016/04/30 Javascript
JS中使用apply方法通过不同数量的参数调用函数的方法
2016/05/31 Javascript
JS选取DOM元素的简单方法
2016/07/08 Javascript
微信小程序 登录实例详解
2017/01/16 Javascript
详解Vue 多级组件透传新方法provide/inject
2018/05/09 Javascript
vue组件挂载到全局方法的示例代码
2018/08/02 Javascript
javascript的this关键字详解
2019/05/20 Javascript
移动端手指操控左右滑动的菜单
2019/09/08 Javascript
微信小程序使用 vant Dialog组件的正确方式
2020/02/21 Javascript
微信小程序以7天为周期连续签到7天功能效果的示例代码
2020/08/20 Javascript
[59:00]OG vs TNC 2018国际邀请赛小组赛BO2 第一场 8.19
2018/08/21 DOTA
Python help()函数用法详解
2014/03/11 Python
仅用50行代码实现一个Python编写的计算器的教程
2015/04/17 Python
Scrapy框架爬取Boss直聘网Python职位信息的源码
2019/02/22 Python
Python数据类型之Number数字操作实例详解
2019/05/08 Python
python3 selenium自动化测试 强大的CSS定位方法
2019/08/23 Python
基于python修改srt字幕的时间轴
2020/02/03 Python
Python3.7黑帽编程之病毒篇(基础篇)
2020/02/04 Python
利用python实现后端写网页(flask框架)
2021/02/28 Python
使用CSS3制作响应式导航菜单的方法
2015/07/12 HTML / CSS
使用CSS3制作版头动画效果
2020/12/24 HTML / CSS
HTML5 placeholder(空白提示)属性介绍
2013/08/07 HTML / CSS
光声世纪笔试题目
2012/08/25 面试题
医药大学生求职简历的自我评价
2013/10/17 职场文书
行政管理专业推荐信
2013/11/02 职场文书
成品仓管员岗位职责
2013/12/11 职场文书
校园活动策划书范文
2014/01/10 职场文书
廉洁自律个人总结
2015/02/14 职场文书
vue3语法糖内的defineProps及defineEmits
2022/04/14 Vue.js