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 &amp; DHTML 实例编程(教程)基础知识
Jun 02 Javascript
Aptana调试javascript图解教程
Nov 30 Javascript
javascript if条件判断方法小结
May 17 Javascript
node.js中的http.request.end方法使用说明
Dec 10 Javascript
jQuery使用slideUp方法实现控制元素缓慢收起
Mar 27 Javascript
JS中完美兼容各大浏览器的scrolltop方法
Apr 17 Javascript
浅析JavaScript动画
Jun 10 Javascript
实现JavaScript高性能的数据存储
Dec 11 Javascript
AngularJS ng-repeat指令中使用track by子语句解决重复数据遍历错误问题
Jan 21 Javascript
十个免费的web前端开发工具详细整理
Sep 18 Javascript
jQuery实现的上传图片本地预览效果简单示例
Mar 29 jQuery
jQuery实现的点击显示隐藏下拉菜单功能完整示例
May 17 jQuery
浅析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
PHP 工厂模式使用方法
2010/05/18 PHP
ThinkPHP模板范围判断输出In标签与Range标签用法详解
2014/06/30 PHP
PHP产生不重复随机数的5个方法总结
2014/11/12 PHP
YII Framework框架教程之国际化实现方法
2016/03/14 PHP
基于php实现的php代码加密解密类完整实例
2016/10/12 PHP
php mysql PDO 查询操作的实例详解
2017/09/23 PHP
雄兵连第三季海报曝光,艾妮熙德成主角,蔷薇新造型
2021/03/09 国漫
JavaScript DOM学习第八章 表单错误提示
2010/02/19 Javascript
JavaScript之Getters和Setters 平台支持等详细介绍
2012/12/07 Javascript
js window.print实现打印特定控件或内容
2013/09/16 Javascript
js取消单选按钮选中示例代码
2013/11/14 Javascript
Seajs的学习笔记
2014/03/04 Javascript
js中利用tagname和id获取元素的方法
2016/01/03 Javascript
JS实现“隐藏与显示”功能(多种方法)
2016/11/24 Javascript
微信小程序学习(4)-系统配置app.json详解
2017/01/12 Javascript
JS 组件系列之 bootstrap treegrid 组件封装过程
2017/04/28 Javascript
vue 指定组件缓存实例详解
2018/04/01 Javascript
详解vuex数据传输的两种方式及this.$store undefined的解决办法
2019/08/26 Javascript
vue的三种图片引入方式代码实例
2019/11/19 Javascript
合并Excel工作薄中成绩表的VBA代码,非常适合教育一线的朋友
2009/04/09 Python
Python常见内置高效率函数用法示例
2018/07/31 Python
10行Python代码计算汽车数量的实现方法
2019/10/23 Python
使用python执行shell脚本 并动态传参 及subprocess的使用详解
2020/03/06 Python
解决Jupyter notebook中.py与.ipynb文件的import问题
2020/04/21 Python
Django 解决由save方法引发的错误
2020/05/21 Python
HTML5 video 上传预览图片视频如何设置、预览视频某秒的海报帧
2018/08/28 HTML / CSS
欧尚俄罗斯网上超市:Auchan俄罗斯
2018/05/03 全球购物
Java和Javasciprt的区别
2012/09/02 面试题
行政总经理岗位职责
2013/12/05 职场文书
应聘编辑职位自荐信范文
2014/01/05 职场文书
村捐赠仪式答谢词
2014/01/21 职场文书
社团文化节策划书
2014/02/01 职场文书
教学评估实施方案
2014/03/16 职场文书
中班上学期个人总结
2015/02/12 职场文书
2015教师年度考核评语
2015/03/25 职场文书
Java并发编程之原子性-Atomic的使用
2022/03/16 Java/Android