javascript删除最后一个孩子dynamic生成tr td

我有一个用JavaScript编写的函数，一旦用户上传excel文件，就会显示数据的logging。

这是我的HTML

<table id="result" class="table table-striped table-responsive"></table> 

和我的Javascript显示从Excel中上传的数据

 // draw HTML table based on sheet data var sheet = parseCSV.getSheet(); var table = document.getElementById('result'); var btnSave = document.getElementById('btnSave'); table.innerHTML = ""; var wrapper0 = $("#column0"); var divMapping = document.getElementById('mapping'); var rowArray = []; var columnArray = []; $('#table').show(); sheet.forEach(function (el, i) { var row = document.createElement('tr'); var button = document.createElement('td'); el.forEach(function (el, i) { var cell = document.createElement('td'); cell.innerHTML = el.value; row.appendChild(cell); }); button.innerHTML = "<button class='btn btn-default'>View</button>"; row.appendChild(button); table.appendChild(row); }); 

这里是我得到的输出的截图。

我不知道为什么它会在底部和headers上生成额外的<tr> 。

Answer 1

为了从标题中删除button，您可以简单地跳过循环中的button添加部分。

  sheet.forEach(function (el, i) { var row = document.createElement('tr'); var button = document.createElement('td'); el.forEach(function (el, i) { var cell = document.createElement('td'); cell.innerHTML = el.value; row.appendChild(cell); }); if(i != 0){ button.innerHTML = "<button class='btn btn- default'>View</button>"; row.appendChild(button); } table.appendChild(row); }); 

Answer 2

sheet可能会迭代返回一个额外的row ，

只需在添加viewbutton之前添加此检查

 if ( row.children && row.children ) { row.appendChild(button); } 

这将确保只有当其他单元格已被推送到row时才添加button。

和标题上。

添加另一个检查，以避免添加到标题

 if ( row.children && row.children && i ) //check if i != 0 { row.appendChild(button); }