我应该使用DIV还是TABLE？

Question

我需要构建一个简单的数据表。所以通常我会说让我们使用表格，这就是它们的用途。

然而，这里有一个额外的小技巧，如果你点击“显示”有一个ajax调用，以显示下面的额外数据。这让我想知道，我应该切换到DIV吗？

我知道两者都有可能 - 但我正在努力寻找更清洁，更容易的东西......

（这里的数据是假的）

Answer 1

您回答自己的问题 - 数据是表格式的，具有水平和垂直关系，因此语义正确的标记绝对是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>

Answer 2

<table>标记用于表格数据。表格数据就是你所拥有的。所以继续，使用表应该没问题。

Answer 3

使用表格显示表格数据。使用div的结构。这是表格数据，因此请使用表格。