如何将多个td包含到tr中？

Question

我只是想在td

中添加tr

表格

<table class="u-full-width" id="result">
  <thead>
    <tr>
      <th>Project Name</th>
      <th>Id</th>
      <th>Event</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>Dave Gamache</td>
      <td>26</td>
      <td>Male</td>
    </tr> 
  </tbody>
</table>

脚本

// Receive Message 
socket.on('message', function(data){
  console.log(data);
  var Project = data.project;
  var Id = data.id;
  var Event = data.event;

  var tr = document.createElement("tr");
  var td1 = tr.appendChild(document.createElement('td'));
  var td2 = tr.appendChild(document.createElement('td'));
  var td3 = tr.appendChild(document.createElement('td'));

  td1.innerHTML = Project;
  td2.innerHTML = Id;
  td3.innerHTML = Event;

  document.getElementById("result").appendChild(td1, td2, td3);
});

我想出了上面的代码，但这不起作用意味着看图像......

Answer 1

最后一行是错误的。您应该将tr附加到表格，而不是所有td s。

document.getElementById("result").appendChild(tr);

Answer 2

document.getElementById（＆＃34; result＆＃34;）。appendChild（td1，td2，td3）;

似乎你将你的tds直接附加到表中，而不是tbody中的tr。

Answer 3

尝试这种方式绑定数据

<table class="u-full-width" id="result">
  <thead>
    <tr>
      <th>Project Name</th>
      <th>Id</th>
      <th>Event</th>
    </tr>
  </thead>
  <tbody id="bodytable">     
  </tbody>
</table>



    socket.on('message', function(data){
      console.log(data); 
      var _html='';
      html +='<tr>'
      html +='<td>'+data.project+'</td>';
      html +='<td>'+data.id+'</td>';
      html +='<td>'+data.event+'</td></tr>';   
      $('#bodytable').append(_html);
      });