在附加表的现有函数中使用 jQuery insertAfter答案

【问题标题】：Use jQuery insertAfter in existing function that appends table在附加表的现有函数中使用 jQuery insertAfter
【发布时间】：2017-10-04 05:42:45
【问题描述】：

这是我目前所拥有的：http://jsfiddle.net/JEAkX/1/

我试图让附加的单元格出现在最后一个 tr 之后。此外，我正在尝试更改 appendTable(id) 函数，以便输出单元格的内容在 <input> 字段中，就像原始单元格一样。

对于<input> 的添加我已经尝试过：

在不同的地方添加输入字段代码<input type='text' size='1' value='subset[i++]' />，但没有运气我也在另一个位置尝试过，但将值更改为value='c'。

对于我尝试过的最后一次 tr 之后的追加：

使用 jQuery 和 .insertAfter('#alphabetTable tbody>tr:last') 我将它添加到 cell.appendChild(document.createTextNode(subset[i++])); 行的各个部分但没有运气..可能是错误的位置？

我觉得自己走在了正确的轨道上，但缺乏 Javascript 知识，无法确切知道在哪里插入代码以及周围的代码是否需要更改。

【问题讨论】：

标签： javascript jquery html-table append

【解决方案1】：

使用 JQuery 会更容易，但这里有一个提示：

function appendTable(id)
{
    var tbody = document.getElementById(id).getElementsByTagName("tbody")[0];
    var i = 0;
    var html = '<tr>';
    for(i=0;i<4;i++){
        html += '<td><input type="text" size="1"/></td>';
    }
    html += '</tr>';

    tbody.innerHTML += html;
}

【讨论】：

【解决方案2】：

jquery：

var $tbody = $('#mytableid tbody:eq(0)');
var $tdLen = $('#mytableid tbody:eq(0) tr:eq(0) td').length; // cell length in row
$("<tr>").appendTo($tbody);
//append cells to row with input text
for (var i=0;i<$tdLen;i++){
    var inp = $("<input>").attr("type","text").attr("name","text"+i).val(i);
    var tdTemo = $("<td>");
    inp.appendTo(tdTemo);
    tdTemo.appendTo("tr:last");
}

此脚本将向表格追加行并添加 4 个包含输入类型文本的单元格：)

【讨论】：

天啊，它在我发布后立即告诉我这个回复：stackoverflow.com/questions/5254283/… 你认为你可以看看那个并告诉我你的想法吗？..我宁愿删除这个问题作为我以一种糟糕的方式问了多个问题哈哈。