- A+
所属分类:Web前端
1 /** 2 * 初始化当天的日历数据 (没有参数默认当天) 3 * @method 4 * @param {Date} date 5 * @param {Number} line 日历中显示几行 6 * @returns [[],[]] 7 */ 8 function initMonthCalendar(dates, line = 6) { 9 var date = new Date(dates); // 初始时间格式 10 var y = date.getFullYear(); 11 var m = date.getMonth(); 12 var days = new Date(y, m + 1, 0).getDate(); // 获取这个月共有多少天 13 var firstDayWeek = new Date(y, m, 1).getDay(); // 月份第一天星期几 14 15 16 var arr = []; // 存储日历格式的数组 17 var n = []; // 日历格式中的一行 18 var d = 1; // 日历格式中的天数 19 20 // 先根据这个月第一天排星期几 21 // 把上个月剩下几天留在这个月的'奸细'放在最前头 22 for(let i = 0; i < firstDayWeek; i++) { 23 // new Date(2020, 8, 0) --> 9月没有0号 === 8月3127 n.unshift(getDate(y, m, 0 - i).getDate()); 28 } 29 30 // 开启循环 31 // 一星期占一行,一行一个外循环 32 // 这里我默认想要6行 33 for (let j = 0; j < line; j++) { 34 // 一天占一个格子,最多一星期7个格子 35 // 这里我想要7个格子 36 for (let i = 0; i < 7; i++) { 39 if(d > days) { 40 // 这个月都放完了,该放什么? 41 // new Date(2020, 8, 31) --> 9月没有31 === 10月1
n.push(new Date(y, m, d++).getDate()); 44 } else { 45 // 放置这个月的天数
n.push(d++); 48 }51 52 if (n.length == 7) break; // 放了7个格子该结束了 53 } 54 55 arr.push(n); 56 n = []; // 这一行放完了,清空ba 57 } 58 59 60 return arr; 61 }
使用:
1 var calendar= initMonthCalendar('2020-09-19'); 2 3 console.log(calendar); 4 5 // [ 6 // [30, 31, 1, 2, 3, 4, 5] 7 // [6, 7, 8, 9, 10, 11, 12] 8 // [13, 14, 15, 16, 17, 18, 19] 9 // [20, 21, 22, 23, 24, 25, 26] 10 // [27, 28, 29, 30, 1, 2, 3] 11 // [4, 5, 6, 7, 8, 9, 10] 12 // ]
获取这一年的日历:
var arr = []; var y = new Date().getFullYear(); for (let i = 0; i < 12; i++) { const d = '' + y + '-0' + (i + 1) + '-01'; arr.push(initMonthCalendar(d)) } console.log(arr)