根据表数据拆分表的行

Spliting row of table according to table data

本文关键字：拆分 数据      更新时间：2023-09-26

它正在制作一个包含1到31个数字的数据的表；在&它应该一直持续到餐桌结束。我的意思是，首先它将插入从1到7，然后应该添加下一行&数据以8&15分钟后，又开始了新的一排。类似日历的东西。

请参阅下面的代码片段。

var myDays = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
var tableHeader = "";
var tableData = "";
var tableRow = "";
for (j = 1; j < 32; j++) {
    tableData += "<td>" + j + "</td>";
}
document.getElementById("days").innerHTML = tableData;
#days, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
#days {
    width: 50%;
    text-align: center;
}
<table id="days"></table>

有一个用于控制行的外循环和一个用于添加每个<td>元素的内循环。通过基于外循环索引的倍数偏移元素，可以控制内循环中元素的值。

基本上，如果j是内循环的索引，而i是外循环的指数，那么取i的倍数（在本例中为i*7），并将j的起点偏移该倍数。请参阅下面的代码示例。

var myDays = ["SUN", "MON", "TUE", "WED", "THU", "FRI", "SAT"];
var tableHeader = "";
var tableData = "";
var tableRow = "";
for (var i=0; i<32/7; i++) {
    var k = i * 7;
    tableData += "<tr>";
    for (var j = 1 + k; j <= 7 + k; j++) {
        if (j > 31) break;
        tableData += "<td>" + j + "</td>";
    }
    tableData += "</tr>";
}
document.getElementById("days").innerHTML = tableData;
#days, th, td {
    border: 1px solid black;
    border-collapse: collapse;
}
#days {
    width: 50%;
    text-align: center;
}
<table id="days"></table>

您可以尝试这个答案

counter=0;
tableData+='<tr>';
            for(j=1; j<32; j++){
            if(counter==7)
            {
                tableData+='</tr>';
                counter=0;
            }
            tableData+= "<td>" + j + "</td>";
            ++counter;
        }
相关文章：