一些帮助javascript创建HTML表反之亦然

时间:2010-07-29 11:23:11

标签: javascript

这是我写的:

var data = [["Jan","Feb","Mar"],["5","10","15"]];
var strTable = '<table>';
for (var i = 0; i < data.length; i++) {
    strTable += '<tr' + ((i % 2) ? ' class="odd"' : '') + '>';
    for (var j = 0; j < data[i].length; j++) {
        strTable += '<td>' + data[i][j] + '</td>';
    }
    strTable += '</tr>';
}
strTable += '</table>';

哪个产生如下表:

Jan | Feb | Mar
5   | 10  | 15

但是我需要更改它以便产生:

Jan | 5
Feb | 10
Mar | 15

我正在努力改变javascript。有人可以帮忙吗?

2 个答案:

答案 0 :(得分:3)

这是:

for (var i = 0; i < data[0].length; i++) { // instead of data.length
    strTable += '<tr' + ((i % 2) ? ' class="odd"' : '') + '>';
    for (var j = 0; j < data.length; j++) {  // instead of data[i].length
        strTable += '<td>' + data[j][i] + '</td>'; // instead of data[i][j]
    }
    strTable += '</tr>';
}

它获取data中第一个子数组的长度,以了解应创建多少行。然后它迭代data中的元素以创建列。

这仅适用于所有阵列都具有相同大小或第一个数组包含最少元素的情况。如果你不能保证这一点,那么首先要计算出具有最少元素的数组元素的数量。

答案 1 :(得分:1)

我会社区维基,因为它涉及一个额外的资源,Underscore.js库:

data = _.zip.apply(_, data);

这会将“数据”数组转向侧面,然后您可以继续使用已有的代码。