向dom添加元素不起作用

Question

When I try to add elements to my dom, they're not added, but when I console.log them, I do get a value <th class="text-right" rowspan="1" colspan="1"></th>

for(c=0; c<2; c++) {

console.log(document.getElementById('achats_table').tFoot.children[0].appendChild(document.createElement('th')));
    document.getElementById('achats_table').tFoot.children[0].appendChild(document.createElement('th'));
        }

Table HTML :

<table>
  <thead>
    <tr>
    </tr>
  </thead>
  <tbody>
  </tbody>
  <tfoot>
    <tr>
    </tr>
  </tfoot>
</table>

what am I doing wrong? how can I debug this? I get no console errors.

Answer 1

It looks like you want to add th elements to a currently blank tfoot? You could try this:

for(c=0; c<2; c++) {
    document.querySelector('#achats_table tfoot').appendChild(document.createElement('th'));
}