如何动态地将行插入到表中

Question

我有一张桌子，上面有一个桌子头和一个空的身体：

<table id ="floodTable" class ="gradient-style">

  <thead>

    <tr>

      <th>Event Name</th>

      <th>Date</th>

      <th style="text-align:right">Return Period</th>

    </tr>

  </thead>

  <tbody>

            ...//add stuff here...      

  </tbody>

</table>

我有一个引入 JSON 对象的 API。如果子对象之一满足某个条件，我想使用属性值来填充新行的值

“事件名称”( document.getElementById("floodTable").rows[0].cells[1])、

“日期”( document.getElementById("floodTable").rows[0].cells[2]) 和

“返回期”( document.getElementById("floodTable").rows[0].cells[3])

使用我的 API 可能会撤回符合我的条件的多个项目，我可能不得不创建几行。我如何使用insertRow(0)和/或insertCell(0)执行此操作？