使用rowspan"规范化"HTML表格

Question

有没有办法确定或计算是否以及如何使用rowspans对HTML表进行规范化？或者,如果有一个JavaScript库可以做到这一点.

例如,这个表:

+-----------+---------+
| Apple     | Red     |
| Apple     | Green   |
| Apple     | Yellow  |
| Sun       | Yellow  |
| Sun       | Hot     |
| Charizard | Hot     |
| Charizard | Pokémon |
+-----------+---------+

会变成这样:

+-----------+---------+
| Apple     | Red     |
|           | Green   |
|           |---------|
|-----------| Yellow  |
| Sun       |-------- |
|-----------| Hot     |
|           |---------|
| Charizard | Pokémon |
+-----------+---------+

看看这个小提琴,看看我的意思:http://jsfiddle.net/scorch/LZKkQ/

其中一些组合很容易手动弄清楚,但有些可能非常复杂.我想尽可能地减少表格,并确保没有其他组合可以进一步减少它.即,最好只有表中的唯一值.

编辑:别介意小提琴中的额外栏目.似乎Firefox在最右边的列上有一些rowpan的问题,所以我不得不为它添加另一个以获得所需的效果.

编辑2:

下面提到的DataTables插件fnMultiRowspan并fnFakeRowspan没有真正得到理想的结果.两个插件都需要事先以正确的方式对表进行排序才能工作; fnFakeRowspan仅适用于一列并fnMultiRowspan在下面给出结果(热和黄色在第二列中重复):

+-----------+---------+
|           | Red     |
| Apple     | Green   |
|           | Yellow  |
|-----------+---------|
| Charizard | Hot     |
|           | Pokémon |
|-----------+---------|
| Sun       | Yellow  |
|           | Hot     |
+-----------+---------+

Answer 1

正如 @MahmoudGamal 上面的评论中提到的，有一个名为DataTables的 jQuery 插件可能很有用。查看fnFakeRowspan函数：

当一行中存在两个或多个具有相同内容的单元格时，在列中创建行跨度单元格，从而有效地将它们直观地分组在一起。注意 - 该插件目前只能在服务器端处理时正确运行。

根据快速阅读的代码，看起来您指定了一个列，然后它会查找重复项，并根据需要组合单元格。（注意：我自己没有尝试过这段代码。）