Question

我有一个通过迭代现有表格收集的数据数组：

    ---------------
    Mon | Hot  | 12 
    ---------------
    Tue | Cold | -2 
    ---------------
    Wed | Warm | 3  
    ---------------
    Thu | Cold | -4 
    ---------------
    Fri | Cold | -3 
    ---------------

数组中的数据存储如下：['Mon'，'Hot'，'12'，'Tue'，'Cold'，' - 2'等等。]

现在需要将数据显示在已翻转行和列的表中，以便数据显示如下：

Mon | Tue  | Wed  | Thu  | Fri
-------------------------------
Hot | Cold | Warm | Cold | Cold
-------------------------------
12  | -2   | 2    | -4   | -3

我正在努力寻找正确的循环语句来正确打印数据。

到目前为止，我有以下内容：

for (i = 0; i < weather_data.length; i++)
{                                                        
    if (i%5==0)
    {
        table.push('<tr><td>'+weather_data[i*3]+'</td>');
    }
    else if(i%4==0)
    {
        table.push('<td>'+weather_data[i*3]+'</td></tr>');
    }
    else
    {
        table.push('<td>'+weather_data[i*3]+'</td>');
    }
}

哪个正确显示了顶行，但其余部分都是未定义的，因为被调用的索引对于数组而言显然太大了。我已经计算出第二行需要调用以下索引：((index-5)*3)+1，但第三行也需要一个不同的索引调用..必须有一个适用于所有行的等式..这个必须是一个相当普遍的操作！

结果表需要按以下顺序显示索引：

0   3   6   9   12
1   4   7   10  13
2   5   8   11  14

因此循环需要按照从左到右，然后下一行等的顺序生成这些。

〜它还需要分别添加必要的起始<tr>和</tr>标记。

Answer 1

var data = ['Mon', 'Hot', '12', 'Tue', 'Cold', '-2', 
            'Wed', 'Warm', '3', 'Thu', 'Cold', '-4'];
var width = 3;
var height = data.length / width;
var r = "";
for(var i = 0; i < width; i++) {
  var row = [];
  for(var j = 0; j < height; j++) {
    row.push("<td>" + data[j * width + i] + "</td>");
  }
  r += "<tr>" + row.join("") + "</tr>";
}  

$("#container_id").html("<table>" + r + "</table>");

使用JS使用错误顺序的数据填充HTML表

1 个答案: