通過 javascript 在表中插入數據

Question

我的 index.html 文件中有一個表

<table id="userTable">
      <tr>
        <th>UserId</th>
        <th>About you</th>
        <th>Age Max</th>
        <th>Age Min</th>
        <th>City</th>
      </tr>
</table>

我使用 firebase 將一些數據拉下來顯示在表格中。

  snapshot.forEach(snap => {
    console.log(snap.val())
    var r = document.getElementById('userTable').insertRow().innerHTML = snap.val().username
    var x = r.insertCell(1);
    x.innerHTML = snap.val().age
  })

firebase 邏輯工作正常，我能夠獲得所需的字段，但我似乎無法將數據插入該行的列中。

我收到一個錯誤：

TypeError: r.insertCell is not a function. (In 'r.insertCell(1)', 'r.insertCell' is undefined)

計划是創建一行，然后使用數據的 rest 填充列。

Answer 1

您在這一行中有兩個作業：

var r = document.getElementById('userTable').insertRow().innerHTML = snap.val().username

在這種情況下，我不確定r的值是多少，但它不是HTMLTableRowElement這就是你得到那個TypeError的原因。 您需要在HTMLTableRowElement object 上調用 insertCell。 有關更多信息，請參閱此文檔： https://developer.mozilla.org/en-US/docs/Web/API/HTMLTableRowElement/insertCell