js 循环生成多 多行多列的div

好的，以下是一个纯 JS 循环生成多行多列的 DIV 元素的实现：

HTML 代码：

<div id="container"></div>

CSS 代码：

.cell {
    width: 50px;
    height: 50px;
    background-color: lightgray;
    margin: 5px;
    float: left;
}

JS 代码：

const container = document.getElementById('container');
const rows = 3;
const cols = 4;

for (let i = 0; i < rows; i++) {
    for (let j = 0; j < cols; j++) {
        const cell = document.createElement('div');
        cell.classList.add('cell');
        cell.innerText = `(${i+1},${j+1})`;
        container.appendChild(cell);
    }
}

这个示例代码使用了两层循环来生成多行多列的 DIV 元素。外层循环控制行数，内层循环控制列数，通过创建 DIV 元素并添加到容器元素中来实现生成。在生成 DIV 元素时，我们可以为它们添加一些样式，如宽高、背景颜色、边距、浮动等。每个 DIV 元素的文本内容可以通过模板字符串来设置为它们的行列坐标。