JavaScript自定义日历效果

本文实例为大家分享了JavaScript自定义日历效果的具体代码,供大家参考,具体内容如下

实现思路:获取每个月的第一天是星期几,然后把前面的天数填充为空,在获取每个月有多少天,循环填充,判断并给给当前时间添加单独样式,点击上一月,和下一月时改变月份。

获取当前月第一天:返回值是 0(周日) 到 6(周六) 之间的一个整数

var date = new Date();
var y=date.getFullYear();
var m=date.getMonth();
new Date(y,m,1).getDay();

获取当前月有多少天

var date = new Date();
var y=date.getFullYear();
var m=date.getMonth();
new Date(y,m+1,-1).getDate()+1;

最后点击上一月,下一月月份加一或减一,在执行封装的日历函数。

全部代码:





    
    
    Document
    



    
上一月 2022年 下一月
五月
  • 1
  • 1
  • 1
  • 1
  • 1
  • 1
  • 1

效果:

JavaScript自定义日历效果_第1张图片

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

你可能感兴趣的:(JavaScript自定义日历效果)