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模板技术
Apr 27 Javascript
HTML中Select不用Disabled实现ReadOnly的效果
Apr 07 Javascript
jquery获取自定义属性(attr和prop)实例介绍
Apr 21 Javascript
jquery 显示*天*时*分*秒实现时间计时器
May 07 Javascript
Javascript基础知识(一)核心基础语法与事件模型
Sep 29 Javascript
jQuery中:only-child选择器用法实例
Jan 03 Javascript
javascript bom是什么及bom和dom的区别
Nov 26 Javascript
javascript生成img标签的3种实现方法(对象、方法、html)
Dec 25 Javascript
关于JS变量和作用域详解
Jul 28 Javascript
easyui messager alert 三秒后自动关闭提示的实例
Nov 07 Javascript
Vue+Element-UI实现上传图片并压缩
Nov 26 Javascript
vue keep-alive实现多组件嵌套中个别组件存活不销毁的操作
Oct 30 Javascript
浅析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
smarty巧妙处理iframe中内容页的代码
2012/03/07 PHP
PHP实现向关联数组指定的Key之前插入元素的方法
2017/06/06 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
jQuery循环滚动展示代码 可应用到文字和图片上
2012/05/11 Javascript
js获取系统的根路径实现介绍
2013/09/08 Javascript
JavaScript验证电子邮箱的函数
2014/08/22 Javascript
JavaScript如何禁止Backspace键
2015/12/02 Javascript
JavaScript String 对象常用方法详解
2016/05/13 Javascript
JavaScript基于对象去除数组重复项的方法
2016/10/09 Javascript
jquery插件bootstrapValidator数据验证详解
2016/11/09 Javascript
无阻塞加载js,防止因js加载不了影响页面显示的问题
2016/12/18 Javascript
jquery中绑定事件的异同
2017/02/28 Javascript
javascript深拷贝的原理与实现方法分析
2017/04/10 Javascript
echarts同一页面中四个图表切换的js数据交互方法示例
2018/07/03 Javascript
vue 使某个组件不被 keep-alive 缓存的方法
2018/09/21 Javascript
vue cli3.0结合echarts3.0与地图的使用方法示例
2019/03/26 Javascript
javascript实现蒙版与禁止页面滚动
2020/01/11 Javascript
JavaScript实现简单的弹窗效果
2020/05/19 Javascript
vue从后台渲染文章列表以及根据id跳转文章详情详解
2020/12/14 Vue.js
[00:18]天涯墨客三技能展示
2018/08/25 DOTA
Python实现快速排序算法及去重的快速排序的简单示例
2016/06/26 Python
matplotlib绘制动画代码示例
2018/01/02 Python
python numpy 一维数组转变为多维数组的实例
2018/07/02 Python
Centos下实现安装Python3.6和Python2共存
2018/08/15 Python
Python使用type关键字创建类步骤详解
2019/07/23 Python
vscode 配置 python3开发环境的方法
2019/09/19 Python
什么是python的必选参数
2020/06/21 Python
详解python UDP 编程
2020/08/24 Python
python中二分查找法的实现方法
2020/12/06 Python
css3实现圆锥渐变conic-gradient效果
2020/02/12 HTML / CSS
迷你分体式空调:SoGoodToBuy
2018/08/07 全球购物
编写函数,将一个3*3矩阵转置
2013/10/09 面试题
党员四风剖析材料
2014/08/27 职场文书
飞越疯人院观后感
2015/06/09 职场文书
读书笔记怎么写
2015/07/01 职场文书
文艺节目主持词
2015/07/06 职场文书