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;

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

全部代码：

    
    
    
    



    

        

            上一月
            2022年
            下一月
        
        
五月
        

            日
            一
            二
            三
            四
            五
            六
        
        

            
1
            
1
            
1
            
1
            
1
            
1
            
1
        
    
    

效果：

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