js根据月份显示日历

function generateCalendar(year, month) {
    const calendarDiv = document.getElementById('calendar');
    calendarDiv.innerHTML = ''; // 清空之前的内容

    const daysInMonth = new Date(year, month + 1, 0).getDate(); // 获取该月的天数
    const firstDay = new Date(year, month, 1).getDay(); // 获取该月第一天是星期几

    let calendarHTML = `
        <div class="header">
            <button onclick="prevMonth()">Prev</button>
            <span>${year}年${month + 1}月</span>
            <button onclick="nextMonth()">Next</button>
        </div>
        <div class="days">
            <div>日</div><div>一</div><div>二</div><div>三</div><div>四</div><div>五</div><div>六</div>
        </div>
        <div class="dates">`;

    // 填充空白日期
    for (let i = 0; i < firstDay; i++) {
        calendarHTML += `<div></div>`;
    }

    // 填充日期
    for (let day = 1; day <= daysInMonth; day++) {
        calendarHTML += `<div>${day}</div>`;
        if ((firstDay + day) % 7 === 0) {
            calendarHTML += '<br>'; // 每周换行
        }
    }

    calendarHTML += `</div>`;
    calendarDiv.innerHTML = calendarHTML;
}

function prevMonth() {
    const [year, month] = getCurrentMonthYear();
    if (month === 0) {
        generateCalendar(year - 1, 11);
    } else {
        generateCalendar(year, month - 1);
    }
}

function nextMonth() {
    const [year, month] = getCurrentMonthYear();
    if (month === 11) {
        generateCalendar(year + 1, 0);
    } else {
        generateCalendar(year, month + 1);
    }
}

function getCurrentMonthYear() {
    const date = new Date();
    return [date.getFullYear(), date.getMonth()];
}

// 初始化日历
generateCalendar(new Date().getFullYear(), new Date().getMonth());