java - 如何使用ajax更新表？

我的问题是，我希望每当有新消息放入消息列表时，就可以在表中显示它。我遇到的问题是我无法删除表中的旧行，因此setInterval只是每秒不断地向表中添加相同的消息，或者我可以对HornService进行编码，以便它仅发送新消息，然后我离开页面并返回，因为列表中没有消息，所以列表中没有任何消息。

在我的support.jsp中，我有：

<table id="supportMessages" class="supportTable">
<tr>
  <td class="supportColumn">
    Status
  </td>
</tr>
</table>

<script type="text/javascript">
$(document).ready(function()
{
  setInterval(ajaxAll, 1000);
  function ajaxAll()
  {
    $.ajax
    ({
       url: "/horn/rest/main/getMessages",
       dataType: "json",
       type: "GET",
       success: function(json)
       {
         for(var i = 0; i < json.length; i++)
         {
           $('#supportMessages tr:nth-child(1)').after(
              '<tr> <td>' + json[i].status + '</td> '+
              '</tr>');
         }
       }
    });
  }
}
</script>

在我的HornService.java中，我有：

static List<Message> messages = new ArrayList<Message>();

@GET
@Path("/getMessages")
public @ResponseBody List<Message> getMessages()
{
  return messages;
}

和Message.java：

public class Message
{
  private String status;
  public String getStatus()
  {
    return status;
  }

  public void setStatus(String status)
  {
    this.status = status;
  }
}

最佳答案

我将其添加到了javascript中，因此现在它仅重新加载了所有行：

$.ajax
({
    url:"/horn/rest/main/getMessages",
    dataType: "json",
    type: "GET",
    success: function(json)
    {
       $("#supportMessages tr").remove();
       $('#supportMessages').prepend('<tr> ' +
             '<td class="supportColumn"> Status </td>' +
             '</tr>');