写日历的时候第一个纠结地方是用ul li 还是直接用table,两种方式都试了一下,还是选择了ul li,讲真table有时候不太好操作。
开始js吧。第一点,简单的标题,周日 周一。。。。这个顺序是以‘周日’开始还是‘周一’,在后面会有影响的。
var weekName = ['周日', '周一', '周二', '周三', '周四', '周五', '周六'];
定义个数组来存吧。
这些都是准备好的东西,当然代码有点坑,写得比较烂,也没有改改。
然后我们再for循环来存weekName
后面就是日期代码了,首先获取当前时间,用来获得当前年,月
var currentDate = new Date();
var currentYear = time.getFullYear(), currentMonth = time.getMonth();//获取当前年、月
然后我们就要想,每个月多少天这个肯定得获取到,但是Date没有直接提供接口让我们获取,然后2月的天数也是不固定的,于是通过年来判断天数,并且定义个数组来存放每个月的天数。
获取到这个,我们还得得到一个重要的东西,每个月的开始是星期几,还好我们能根据getDay()来得到
var initDate = new Date(currentYear, currentMonth, 1);
var firstDay = initDate.getDay();//获取当前月第一天是周几0、1、2、3、4....
随后我们得循环输出日历,可是我们要怎么开始,我们想,若第一天是周日对应的firstDay是0,那么我们应该是1号,若是周一则firstDay是1以此类推会加一
于是会 var date_str = i - firstDay + 1; i是for循环的N值
本日历是固定的6行,若有不同需求自行判断。且忽略ul li什么什么的。。。
至此,基本就完成了。
再加两个上一个月,下一个月方法,注意月份的正确性,因为我这里要传函数里再取一次,所以下一个月的时候得多加一个月,相反,上一个月不用变就好