HTML表格 - 样式个别成千上万的单元格

在制作应用程序的html版本的过程中，一部分是可以结束拥有许多单元格的表格。HTML表格 - 样式个别成千上万的单元格

左右：150列，最多可容纳10,000行。

问题就是表现，为什么能够根据内容对每个单元格进行样式设计会是什么样的呢？

在每个单元

所以是一个数字，并填入根据这个数字在符合比例的背景颜色

例如：已绑扎

77-100 = red 
33 - 77 = blue 
0 < 33 = green 
0 = black

我曾尝试在一个小桌子给每个我想为它着色的课程。（颜色是用户可更换，所以设置一类，应该可以改变类定义）

所以得到这样的：

<tr> 
    <td class='percentile-100'>87.5%</td> 
    <td class='percentile-77'>75.0%</td> 
    <td class='percentile-0'>0.0%</td>

和CSS，设置样式类。只需要4种样式。

现在有（150 * 10,000 =）1,500,000个细胞需要样式化，我在想什么样的影响可能会是什么样子。

表格由JavaScript与数据生成。但是，在MB领域的数据是。表格然后呈现在客户端。所以作为渲染，决定设置什么类的值。

还有其他可能的方式根据内容对每个单元格进行样式设置？

2014-12-21 Maze

即使有1.5M的细胞，你仍然在谈论101个百分点的课程。我个人认为这会比1.5M内嵌式背景颜色更好。 – rfornal

我建议分配服务器端的类，而不是将该任务交给使用相对少量内存的潜在移动设备（我不想看看这对我的iPad Air会有什么影响，仅有1GB，例如，要记住任何有10000行的表的用户界面（很可能是）很痛苦 –

实际上，内联样式在浏览器上的渲染速度比使用类的时候要快，但它仍然是一个非常糟糕的用户界面（除非你只是试图在屏幕上放置颜色块，在这种情况下，你应该使用画布或服务器生成的图像） – symcbean

我认为最好的方法是不一次加载这么多的行。我做了一个程序，它比较了成千上万的数据点，并且它的加载非常缓慢 - 问题是我显示了所有的单个结果。最后它很好，但我们只需要看看总数。如果有人正在寻找他们，我最终只显示总数并做出ajax调用来重新获得个别结果。

简而言之，如果您担心需要花费很长时间来设计所有单元格的样式，那么您应该不会一次加载太多的单元格。可能想看看AJAX pagination。

2015-02-06 05:17:48 DACrosby

回答