使用 jQuery 将列添加到表中

【问题标题】：Add Column to table with jQuery使用 jQuery 将列添加到表中
【发布时间】：2018-10-04 01:14:50
【问题描述】：

是否可以像这样向现有表添加列：

<table id="tutorial" width="600" border="0">
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
  <tr>
    <td>&nbsp;</td>
    <td>&nbsp;</td>
  </tr>
</table>

用js？

【问题讨论】：

标签： javascript jquery html-table

【解决方案1】：

你可以这样做

 $('#tutorial').find('tr').each(function(){
        $(this).find('td').eq(n).after('<td>new cell added</td>');
   });

n 可以替换为要添加新列的列之后的数字

【讨论】：

并添加标题，如果你使用它：$('table').find('tr').each(function(){ $(this).find('th').eq(-1).after('<th>HEADER</th>'); $(this).find('td').eq(-1).after('<td>ROW</td>'); });

【解决方案2】：

您可以使用.append() 将新的td 附加到行

$('#tutorial tr').append('<td>new</td>')

演示：Fiddle

【讨论】：

或者使用 prepend() 在每一行的开头添加一个单元格。

【解决方案3】：

你的意思是列而不是行？

$('#tutorial tr').each(function()
{
    $(this).append('<td></td>');
});

选择 id "tutorial" 内的 <tr> 元素（即您的表格就是这种情况）并在其原始内容后面附加新内容

【讨论】：

【解决方案4】：

上述方法的另一种选择是与其他列和display:none; 样式一起创建列，然后使用method .Show() 显示。

【讨论】：