Javascript 如何插入<；tr>；元素转换为动态表？

我希望有人能给我一个线索。我是javascript新手，我正在尝试用一个动态生成的表来构建这个结构

<table>
<tr>
  <td>value1</td>
  <td>value2</td>       
  <td>value3</td>
  <td>value4</td>
</tr>
<tr>
  <td>value5</td>
  <td>value6</td>       
  <td>value7</td>
  <td>value8</td>
</tr>
<tr>
  <td>value9</td>
  <td>value10</td>      
  <td>value11</td>
  <td>value12</td>
</tr>
<tr>
  <td>value13</td>
  <td>value14</td>      
  <td>value15</td>
  <td>value16</td>
</tr>
</table>

我知道，这不是最优雅的解决方案，但它很有效。

---

再次感谢所有给我提示的人，你帮我解决了这个问题

您可以使用jquery和

.each

进行迭代，并在每次迭代中使用

.nth child

获取第四个元素，然后使用

进行插入。insertAfter

请找到相应的示例来维护表。 这是你能做到的一种方法

<table class="test_table" id="test_table">
</table>

var tableEl = $(".test_table");
var noOfRows = 4;
var noOfColumns = 4;
//Empty the table in case there is anything already there

tableEl.each(function(){
    var tableElObject = $(this);
    for(i=0;i<noOfRows;i++)
    {
        rowStart = "<tr>";
        for(j=0;j<noOfColumns;j++)
        {
            rowStart +="<td>"+"Test"+i+j+"</td>";
        }
        tableElObject.append(rowStart+"<tr/>");
    }

});

var tableEl=$（“.test_table”）；
var noOfRows=4；
var noOfColumns=4；
//清空桌子，以防已经有东西了
表1.每个（函数（）{
var tableObject=$（此项）；
对于（i=0；i如果您想动态创建表trs和tds，这种方法对您来说会更好

var table = document.createElement('table');
    table.setAttribute('border','0');
    table.setAttribute('cellspacing','5');
    table.setAttribute('cellpadding','5');
    table.setAttribute('width','100%');

    var tr = table.insertRow(-1);// "-1"s meaning add tr to end of table if you want to add top of table you must use "0"
        tr.id = 'Tr1 ID';

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 1';

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 2';

    var tr = table.insertRow(-1);

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 1';

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 2';

echo
不是JavaScript。但是您可以用当前创建td元素的相同方式创建tr元素。然后将tr追加到表中，并将tds追加到最新的tr中。最明显的解决方案是将for循环增加4，如
for（var i=0；为了快速回复，我也尝试了您的方法！问题表需要位于以下for each循环的内部：
$.each（TonsOfData.getValues（），function（index，somevalue）
，因为它一次只能获取一条实时数据。这意味着，我无法将其存储在数组中并将其传递到表中。（这正是我需要的结构，谢谢！）感谢您的快速回复！尽管js的行为与我预期的不一样，但我仍在努力实现这一点。我尝试了以下方法：
$（“”）.insertBefore（“td:eq（0）”；$（“”）.insertAfter（“td:eq（3）”；$（“”）.insertAfter（“td:eq（7）”）
但是当我用jsfiddle测试它时，什么都没有发生。我甚至不确定它是否被允许将
分成两部分。我也尝试了这种方法：
$（''）.insertAfter（'.'我的表td:nth child（4）；$（''）.insertBefore（'.'我的表td:nth child（1）；
，但也没有运气。我似乎遗漏了一些关键点。
$('#somevalue_id td.select1').wrapAll('<tr/>');
$('#somevalue_id td.select2').wrapAll('<tr/>');  
$('#somevalue_id td.select3').wrapAll('<tr/>');  
$('#somevalue_id td.select4').wrapAll('<tr/>');  
$('#somevalue_id td.select5').wrapAll('<tr/>');

<table class="test_table" id="test_table">
</table>

var tableEl = $(".test_table");
var noOfRows = 4;
var noOfColumns = 4;
//Empty the table in case there is anything already there

tableEl.each(function(){
    var tableElObject = $(this);
    for(i=0;i<noOfRows;i++)
    {
        rowStart = "<tr>";
        for(j=0;j<noOfColumns;j++)
        {
            rowStart +="<td>"+"Test"+i+j+"</td>";
        }
        tableElObject.append(rowStart+"<tr/>");
    }

});

var table = document.createElement('table');
    table.setAttribute('border','0');
    table.setAttribute('cellspacing','5');
    table.setAttribute('cellpadding','5');
    table.setAttribute('width','100%');

    var tr = table.insertRow(-1);// "-1"s meaning add tr to end of table if you want to add top of table you must use "0"
        tr.id = 'Tr1 ID';

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 1';

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 2';

    var tr = table.insertRow(-1);

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 1';

        var td = tr.insertCell(-1);
            td.innerHTML = 'Inside of TD 2';