动态更新表格 - Ajax HTML

Question

随着下表出现新记录，我正在尝试更新该表：

我有需要使用 Ajax 获取实时信息的部分。我使用 <tr id = {$university}> 作为 ids 来创建新行或更新现有行。但更新似乎不起作用。即，如果为 A 大学创建新学生条目，则添加新的 HTML 代码。所以我现有的 HTML 代码看起来像

<tr id = "A">
    <td>A</td>
    <td>Mr. X</td>
    <td>a@b.com</td>
</tr>
<tr id = "A">
    <td></td>
    <td>Mr. Y</td>
    <td>e@f.com</td>
</tr>
<tr id = "A">
    <td></td>
    <td>Mr. S</td>
    <td>u@i.com</td>
</tr>

当我使用相同的<tr id = "A"> 添加新数据时，它不会附加信息，而是创建一个新行：

<tr id = "A">
    <td>A</td>
    <td>Mr. Z</td>
    <td>t@t.com</td>
</tr>

不会附加信息，而是在 UI 中创建另一行。如何将新信息附加到现有行？

添加js代码：http://pastebin.com/4tjyUgZa

Answer 1

HTML 中的 ID 是唯一的，您不应该复制它们。尝试改用一个类，例如<tr class="a">。

我还认为您需要重新审视您的表格结构。看起来您需要的是多个表，例如表“a”和表“b”，然后您可以将行附加到。您操作表格行的方式并不是它们的工作方式。如果您有 <table id="a"> 和 <table id="b"> 之类的内容，则可以简单地定位它们并轻松添加行。

您可能还想使用 jQuery 等 JavaScript 框架。这将使操作表格变得更加容易，并且您将能够更快地编写代码。