我需要建立一个简单的数据表。所以通常我只会说让我们使用表格,这就是它们的用途。
然而,这里还有一个额外的小技巧,如果您单击“显示”,则会有一个 ajax 调用来显示下面的额外数据。这让我想知道,我应该切换到 DIV 吗?
我知道两者都是可能的 - 但我正在尝试看看什么更清洁,更容易......
(这里的数据是假的)
您回答自己的问题 - 数据是表格的,具有水平和垂直关系,因此语义上正确的标记绝对是table
. 预期的用户界面不应该考虑语义选择。
tr
您可以通过在单击的元素下方插入一个具有正确数据的新元素来轻松且正确地实现显示按钮。
考虑到原始标记如下:
<tr>
<td>1</td>
<td>Orlando</td>
<td>Gee</td>
<td>phone number</td>
<td><button>show</button></td>
</tr>
然后,您可以在 JS 中附加所需的新行,每个属性一个:
<tr class="otherbg-and-bold">
<td></td>
<td colspan="2">email address</td>
<td colspan="2">sample@company.tld</td>
</tr>
<table>
标签用于表格数据。表格数据就是您所拥有的。所以继续吧,使用表格应该没问题。
使用表格显示表格数据。使用 div 的结构。这是表格数据,因此请使用表格。