用js动态生成一个三行四列的li

可以使用以下代码来动态生成一个三行四列的 `li` 元素：

// 获取要插入列表的容器
const listContainer = document.getElementById('list-container');

// 创建要插入的列表
const list = document.createElement('ul');

// 循环创建 3 行 4 列的 li 元素
for (let i = 0; i < 3; i++) {
  const row = document.createElement('li');
  for (let j = 0; j < 4; j++) {
    const col = document.createElement('li');
    col.textContent = `Row ${i + 1}, Col ${j + 1}`;
    row.appendChild(col);
  }
  list.appendChild(row);
}

// 将列表插入到容器中
listContainer.appendChild(list);

在 HTML 中，需要有一个容器元素来插入生成的列表，例如：

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

运行以上代码，就可以在 `list-container` 容器中生成一个三行四列的列表。

相关问题

用JS编写一个盒子里垂直放置多行内容，多行内容自动滚动的效果

在JavaScript中，我们可以使用HTML、CSS和JavaScript库如jQuery或者原生JavaScript来实现一个盒子内垂直内容滚动的效果。下面是一个基本的示例：

首先，创建一个HTML元素作为容器：

<div id="scrolling-container" style="overflow-y: scroll; width: 200px; height: 200px;">
  <!-- 这里将会包含你的多行内容 -->
</div>

然后，添加多行内容到这个容器中，例如通过动态生成：

// 使用jQuery
var content = ["这是第一行", "这是第二行", "这是第三行..."];
for (var i = 0; i < content.length; i++) {
  $('#scrolling-container').append('<p>' + content[i] + '</p>');
}

// 或者使用纯JavaScript
var contentList = document.createElement('ul');
content.forEach(function(item) {
  var listItem = document.createElement('li');
  listItem.textContent = item;
  contentList.appendChild(listItem);
});
document.getElementById('scrolling-container').appendChild(contentList);

最后，给容器设置适当的滚动条样式，使其可以根据内容高度自动滚动：

#scrolling-webkit-scrollbar-width: 10px; /* For Webkit browsers */
  scrollbar-width: 10px; /* For Firefox browser */
  overflow-y: auto;
}