SOURCE

console 命令行工具 X clear

                    
>
console
let content2 = document.querySelector('.container')

let list = [1, 2, 3, 4, 5, 6,7,8,9,5,4]

function addItem(dom,arr,rownum){
    let length = arr.length
    if(length > rownum){
        let num = rownum - length % rownum
        let arr2 = new Array(num).fill(null)
        arr = [...arr,...arr2]
    }
    arr.forEach(item => {
        let itemDom = document.createElement('div')
        itemDom.classList.add('item')
        itemDom.textContent = item
        if(item === null) itemDom.classList.add('notShow')
        dom.appendChild(itemDom)
    })
}
addItem(content2,list,7)
<div class="container">
</div>
.container {
  display: flex;
  align-items: center;justify-content: center;
  
  flex-wrap: wrap;
}

.item {
    background-color: skyblue;
    width: 30px;
    height: 30px;
    text-align: center;
    margin: 15px 15px 0 0;
    /* flex: 0 0 calc(100% / 7); */
}
.item:nth-of-type(7n){
    margin-right: 0;
}
.notShow{
    visibility: hidden;
}