使用js实现一个日历

首先在html里面写一个div

<div class="content"></div>

下面是js部分的代码

// 创建一个日历
createCalendar(2024,9)
function createCalendar (year,month) {
    // 本月有几天
    let date = new Date(year,month,0).getDate()
    // 本月第一天是周几
    let day = new Date(year,month-1,1).getDay()
    // 周几 规则数组 转化后的周几
    let dayS = [7,1,2,3,4,5,6][day]
    // 计算出 本月的数据 能占几行  
    let hangeNum = Math.ceil((date - (7 - dayS)) / 7) + 2  // 加2 是因为标题占一行 第一周减去了占一行
    // 几号
    let jihao = 1
    let table = document.createElement('table')
    for (let index = 0; index < hangeNum; index++) {
        let tr = document.createElement('tr')
        let arr = []
        for (let i = 0; i < 7; i++) {
            if(index == 0){
                let th = document.createElement('th')
                th.textContent = `星期${['一','二','三','四','五','六','日'][i]}`
                arr.push(th)
            }else{
                let td = document.createElement('td')
                // 第一周
                if(index == 1){
                    // 计算第一天 在哪个位置
                    if((i + 1) >= dayS){
                        td.textContent = jihao
                        jihao++
                    }
                }else{
                    td.textContent = jihao
                    // 日期 等于 本月天数 结束
                    if(jihao == date + 1) break
                    jihao++
                }
                arr.push(td)
            }
            // ...数组将 数组变成节点数组
            tr.append(...arr)
        }
        table.append(tr)
    }
    table.border = "1"
    let contentS = document.querySelector('.content')
    contentS.append(table)
}