js获取当前周、上一周、下一周日期


Posted in Javascript onMarch 19, 2017

效果图:

js获取当前周、上一周、下一周日期

代码如下:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html >
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>日历操作</title>
  <script>
    window.onload = function(){     
      var cells = document.getElementById('monitor').getElementsByTagName('td');
      var clen = cells.length;
      var currentFirstDate;
      var formatDate = function(date){       
        var year = date.getFullYear()+'年';
        var month = (date.getMonth()+1)+'月';
        var day = date.getDate()+'日';
        var week = '('+['星期天','星期一','星期二','星期三','星期四','星期五','星期六'][date.getDay()]+')'; 

        return year+month+day+' '+week;
      };
      var addDate= function(date,n){    
        date.setDate(date.getDate()+n);    
        return date;
      };
      var setDate = function(date){       
        var week = date.getDay()-1;
        date = addDate(date,week*-1);
        currentFirstDate = new Date(date);

        for(var i = 0;i<clen;i++){         
          cells[i].innerHTML = formatDate(i==0 ? date : addDate(date,1));
        }        
      };       
      document.getElementById('last-week').onclick = function(){
        setDate(addDate(currentFirstDate,-7));     
      };       
      document.getElementById('next-week').onclick = function(){         
        setDate(addDate(currentFirstDate,7));
      };   
      setDate(new Date());
    }
  </script>
</head>
<body>
  <button id="last-week">上一周</button><button id="next-week">下一周</button>
  <table id="monitor">
    <tr>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
      <td></td>
    </tr>
  </table>
</body>
</html>

以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,同时也希望多多支持三水点靠木!

Javascript 相关文章推荐
javascript firefox 自动加载iframe 自动调整高宽示例
Aug 27 Javascript
对于jQuery性能的一些优化建议
Aug 13 Javascript
jQuery插件ajaxFileUpload异步上传文件
Oct 19 Javascript
JSP防止网页刷新重复提交数据的几种方法
Nov 19 Javascript
关于jquery layui弹出层的使用方法
Apr 21 jQuery
React事件处理的机制及原理
Dec 03 Javascript
vue封装一个简单的div框选时间的组件的方法
Jan 06 Javascript
JavaScript中的垃圾回收与内存泄漏示例详解
May 02 Javascript
express启用https使用小记
May 21 Javascript
vue实现输入框的模糊查询的示例代码(节流函数的应用场景)
Sep 01 Javascript
layer扩展打开/关闭动画的方法
Sep 23 Javascript
Vue组件简易模拟实现购物车
Dec 21 Vue.js
浅析bootstrap原理及优缺点
Mar 19 #Javascript
jQuery中用on绑定事件时需注意的事项
Mar 19 #Javascript
$.browser.msie 为空或不是对象问题的多种解决方法
Mar 19 #Javascript
JavaScript数据结构之链表的实现
Mar 19 #Javascript
用jQuery实现圆点图片轮播效果
Mar 19 #Javascript
Bootstrap 网格系统布局详解
Mar 19 #Javascript
用JavaScript和jQuery实现瀑布流
Mar 19 #Javascript
You might like
apache php模块整合操作指南
2012/11/16 PHP
php生成图形(Libchart)实例
2013/11/06 PHP
php常用字符串比较函数实例汇总
2014/11/24 PHP
使用PHP uniqid函数生成唯一ID
2015/11/18 PHP
Smarty保留变量用法分析
2016/05/23 PHP
详谈PHP中public,private,protected,abstract等关键字的用法
2017/12/31 PHP
PHP使用两个栈实现队列功能的方法
2018/01/15 PHP
php基于协程实现异步的方法分析
2019/07/17 PHP
该如何加载google-analytics(或其他第三方)的JS
2010/05/13 Javascript
js 函数调用模式小结
2011/12/26 Javascript
JavaScript使用shift方法移除素组第一个元素实例分析
2015/04/06 Javascript
VUEJS实战之利用laypage插件实现分页(3)
2016/06/13 Javascript
JavaScript DOM 对象深入了解
2016/07/20 Javascript
Angular利用trackBy提升性能的方法
2018/01/26 Javascript
vue项目中常见问题及解决方案(推荐)
2019/10/21 Javascript
vue项目查看vue版本及cli版本的实现方式
2020/10/24 Javascript
小程序实现tab标签页
2020/11/16 Javascript
[01:21]DOTA2新纪元-7.0新版本即将开启!
2016/12/11 DOTA
python使用matplotlib库生成随机漫步图
2018/08/27 Python
Python完成毫秒级抢淘宝大单功能
2019/06/06 Python
Python依赖包整体迁移方法详解
2019/08/15 Python
详解Python图像处理库Pillow常用使用方法
2019/09/02 Python
Keras 利用sklearn的ROC-AUC建立评价函数详解
2020/06/15 Python
size?瑞典:英国伦敦的球鞋精品店
2018/03/01 全球购物
ProBikeKit德国:在线公路自行车专家
2018/06/03 全球购物
严选全球尖货,立足香港:Bonpont宝盆
2018/07/24 全球购物
be2台湾单身男女交友:全球网路婚姻介绍的领导品牌
2019/10/11 全球购物
Zooplus罗马尼亚:宠物食品和配件
2019/11/02 全球购物
定义一结构体变量,用其表示点坐标,并输入两点坐标,求两点之间的距离
2015/08/17 面试题
大学生活学习的自我评价
2013/12/03 职场文书
《翻越远方的大山》教学反思
2014/04/13 职场文书
2014年扶贫帮困工作总结
2014/12/09 职场文书
旷课检讨书
2015/01/26 职场文书
2015年生活老师工作总结
2015/05/27 职场文书
2015小学音乐教师个人工作总结
2015/07/21 职场文书
《一面五星红旗》教学反思
2016/02/23 职场文书