2018-08-25

2018-08-25  本文已影响0人  yulinkya

用javascript写日历

这是刚开始学习js基础时做的一个小小的日历案例,只是完成了简单的日历功能,可以输出指定年月的日历。

canlendar.png

上面的输入框表示输入年份和月份,下面输出对应的日历。

写日历可以概括为以下思路:

        1. 计算某月的天数

        2. 计算指定年份某月1号距1900-1-1有多少天(只要找一个1月1日星期一的年份都可以实现计算)

        3. 计算某月第一天是星期几

        4. 正确处理换行的位置

首先封装函数,计算闰年平年

/*平年闰年*/

function isRn(year) {

return year % 4 === 0 && year % 100 !== 0 || year % 400 === 0;

}

计算某年某月有多少天,这里用的switch循环结构:

function calcMonthDays(year, month) {

var days;

switch (month) {

case 2:

days = isRn(year) ? 29 : 28;

break;

case 4:

case 6:

case 9:

case 11:

days = 30;

break;

default:

days = 31;

}

return days;

}

计算某年某月1号距1900-1-1有多少天的函数:

function calTotalDays(year, month) {

var allDays = 1;

for (var i = 1; i < month; i++) {

allDays += calcMonthDays(year, i);

}

for (var i = 1900; i < year; i++) {

allDays += isRn(i) ? 366 : 365;

}

return allDays;

}

计算星期:

function calcWeekDays(year, month) {

//计算距离1900-1-1有多少天

var _totalDays = calTotalDays(year, month);

//计算该月的第一天是星期几

var _weekday = _totalDays % 7;

return _weekday;

}

打印日历:

function prMonthCalendar(year, month) {

var _weekday = calcWeekDays(year, month);

var canlendar = "日\t一\t二\t三\t四\t五\t六\n";

for (var i = 0; i < _weekday; i++) {

//打印空格

canlendar += " \t";

}

var _days = calcMonthDays(year, month);

for (var i = 1; i <= _days; i++) {

canlendar += i + "\t";

if ((_weekday + i) % 7 === 0)

canlendar += "\n";//换行

}

console.log(canlendar);

}

在这基础上可以打印出指定年份的12个月的日历,只需在打印的时候加个for循环,如下:

for (var i = 1; i <= 12; i++) {//从一月份打印到12月

console.log(prMonthCalendar(2018, i));//调用打印日历的函数,指定年份2018

}

上一篇下一篇

猜你喜欢

热点阅读