我在 html 中使用 javascript 动态附加表格,例如 50000 个单元格。
<table id="dataTable">
<tbody>
<tr>
<td>data1</td>
<td>data2</td>
.....
<td>data1</td>
</tr>
..........
<tr>
<td>data1</td>
<td>data2</td>
.....
<td>data1</td>
</tr>
</tbody>
</table>
我用后代选择器为 td 设置样式,
#dataTable td{
text-align:right;
border:1px solid #adadad;
padding-right:10px;
}
另一种选择是使用类选择器为每个 td 赋予类。
<table id="dataTable">
<tbody>
<tr>
<td class="format">data1</td>
<td class="format">data2</td>
.....
<td class="format">data1</td>
</tr>
..........
<tr>
<td class="format">data1</td>
<td class="format">data2</td>
.....
<td class="format">data1</td>
</tr>
</tbody>
</table>
在这里,我们使用格式类进行样式设置。
.format{
text-align:right;
border:1px solid #adadad;
padding-right:10px;
}
在浏览器中呈现表格时,我遇到了性能问题。这是因为我使用了 DESCENDANT SELECTOR 而不是 CLASS SELECTOR。或者浏览器无法处理大数据。