html 循环list取值放入生成的表格中,每14个生成一个表格存储
时间: 2023-06-15 15:08:05 浏览: 144
你可以使用HTML和JavaScript来实现这个功能。具体的实现步骤如下:
1. 创建一个列表,在JavaScript中存储列表的值。
```javascript
var list = ["value1", "value2", "value3", "value4", "value5", "value6", "value7", "value8", "value9", "value10", "value11", "value12", "value13", "value14", "value15", "value16", "value17", "value18", "value19", "value20", "value21", "value22", "value23", "value24"];
```
2. 创建一个函数,用来生成表格。
```javascript
function generateTable(list) {
// 计算列表长度
var length = list.length;
// 计算需要生成多少个表格
var tableCount = Math.ceil(length / 14);
// 创建表格的 HTML 代码
var tableHTML = "";
// 循环生成表格
for (var i = 0; i < tableCount; i++) {
tableHTML += "<table>";
// 计算每个表格需要生成多少行数据
var start = i * 14;
var end = start + 14;
if (end > length) {
end = length;
}
// 循环生成表格行数据
for (var j = start; j < end; j++) {
tableHTML += "<tr><td>" + list[j] + "</td></tr>";
}
tableHTML += "</table>";
}
// 将生成的 HTML 代码插入到页面中
document.getElementById("tableContainer").innerHTML = tableHTML;
}
```
3. 在HTML页面中创建一个容器,用来存储生成的表格。
```html
<div id="tableContainer"></div>
```
4. 调用生成表格函数,将列表中的值生成为多个表格。
```javascript
generateTable(list);
```
在上述代码中,我们先计算列表的长度,然后通过除以14来计算需要生成多少个表格。接着循环生成每个表格的行数据,每14个值生成一行。最后将生成的HTML代码插入到页面中指定的容器中。
你可以将上述代码复制到你的HTML文件中,然后修改列表中的值来测试这个功能。
阅读全文