javascript - 我在 DOM 中看不到 16x16 网格的列

Question

我正在尝试构建一个 16x16 网格，但是 makeColumns 函数似乎不起作用，我只能从 DOM 中的函数 makeRows 中看到 div。这是我的代码。（在我的 HTML 正文中，我只有）

const container = document.querySelector("#container");
const gridRows = document.querySelectorAll(".rows");
const gridCells = document.querySelectorAll(".cells");

function makeGrid() {
   makeRows(16);
   makeColumns(256);
};

console.log(makeGrid())

function makeRows(numberOfRows) {
    for(let i = 0; i < numberOfRows; i++) {
        let row = document.createElement("div");
        row.classList.add("rows");
        container.appendChild(row);
    };
};


function makeColumns(numberOfCells){
    for(let j = 0; j < gridRows.length; j++){
        for(let k = 0; k < numberOfCells; k++){
            let cell = document.createElement("div");
            cell.classList.add("cells");
            gridRows[k].appendChild(cell);
        
        };
    };
}

标签： javascriptdom