如何使用单个字符串数组(Javascript、HTML)填充3列
如何使用单个字符串数组(Javascript、HTML)填充3列
提问于 2018-10-29 00:54:50
如果我有一个存储了15个字符串的数组，并且我想填充3列(理想情况下是3个用div生成的引导程序列，但可以是任何列，只要它们有响应)，从第一列开始每列都有5个字符串，那么在javascript/jQuery中有什么简单的方法可以做到这一点呢？
现在我正在考虑做三个不同的 loops，检查array[n]将<li>附加到三个不同的<ul>上5次，我给它们分配了一个ID，但听起来似乎有一个更容易的方法来实现它。
也许是一个css技巧，将15个字符串分成三列？
回答 1
Stack Overflow用户
发布于 2018-10-29 01:22:43
您可以使用splice将数组中的前5个元素提取到一个新数组中，然后使用join()连接这些元素。根据您的描述，此代码应该可以工作：
已更新
let arr = [0 ,1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14];
let columns = [".col1", ".col2", ".col3"]
for(let i = 0; i<3; i++)
document.querySelector(columns[i]).innerHTML = `<li>${arr.splice(0, 5).join("</li><li>")}</li>`;body{
display: grid;
grid-template-columns: 1fr 1fr 1fr;
}<ul class="col1"></ul>
<ul class="col2"></ul>
<ul class="col3"></ul>
注意，我在数组中使用了数字而不是字符串，因为我懒得考虑很酷的字符串:)
注意：完成此操作后，您的arr将为空。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/53033918
复制相关文章
相似问题
腾讯云开发者
