Jquery动态表创建？

如何使用我用创建的JQuery创建动态表。append但问题是当我再次单击时，请创建另一个表，但我希望将外接程序添加到同一个表中，所以如何才能做到这一点请帮助我

$(function () {
    $("#addProduct").click(function () {
        var table = $('<table></table>').addClass('foo');
        for (i = 0; i < 10; i++) {
            var row = $('<tr></tr>');
            for (i = 0; i < 10; i++) {
                var row1 = $('<td></td>').addClass('bar').text('result ' + i);
                table.append(row);
                row.append(row1);
            }
        }
        $('#someContainer').append(table);
    });
});

$（函数（）{
$（“#添加产品”）。单击（函数（）{
变量表=$（''）.addClass（'foo'）；
对于（i=0；i<10；i++）{
变量行=$（''）；
对于（i=0；i<10；i++）{
var row1=$（''）.addClass（'bar'）.text（'result'+i）；
表.追加（行）；
行。追加（第1行）；
}
}
$（'#someContainer'）。追加（表）；
});
});

这是HTML

<button id="addProduct">Add Product</button>

<div id="someContainer"></div>

添加产品

如果只想执行一次，请尝试在jQuery中使用

$(function () {
    $("#addProduct").one("click", function () {

        var table = $('<table></table>').addClass('foo');
        for (i = 0; i < 10; i++) {
            var row = $('<tr></tr>');
            for (i = 0; i < 10; i++) {
                var row1 = $('<td></td>').addClass('bar').text('result ' + i);
                table.append(row);
                row.append(row1);
            }
        }
        $('#someContainer').append(table);
    });
});

$（函数（）{
$（“添加产品”）。一个（“单击”，函数（）{
变量表=$（''）.addClass（'foo'）；
对于（i=0；i<10；i++）{
变量行=$（''）；
对于（i=0；i<10；i++）{
var row1=$（''）.addClass（'bar'）.text（'result'+i）；
表.追加（行）；
行。追加（第1行）；
}
}
$（'#someContainer'）。追加（表）；
});
});

检查。

试试我的答案

$(function () {
    $("#addProduct").click(function () {
          var table = $('<table></table>').addClass('foo');
        for (var i = 0; i < 10; i++) {
                row = $('<tr></tr>');
                for (var j = 0; j < 10; j++) {
                    var rowData = $('<td></td>').addClass('bar').text('result ' + j);
                    row.append(rowData);
                }
                table.append(row);
            }

        if ($('table').length) {
             $("#someContainer tr:first").after(row);
        }
        else {
            $('#someContainer').append(table);
        }
    });
});

$（函数（）{
$（“#添加产品”）。单击（函数（）{
变量表=$（''）.addClass（'foo'）；
对于（变量i=0；i<10；i++）{
行=$（''）；
对于（var j=0；j<10；j++）{
var rowData=$（''）.addClass（'bar'）.text（'result'+j）；
追加（rowData）；
}
表.追加（行）；
}
如果（$（‘表’）。长度）{
$（“#someContainer tr:first”）。在（行）之后；
}
否则{
$（'#someContainer'）。追加（表）；
}
});
});

试试这个

$(function() {  
    $("#addProduct").click(function() {
        if($('#someContainer table').length > 0)
        {
            var row = $('<tr></tr>');
            for(i=0; i<10; i++){
                var row1 = $('<td></td>').addClass('bar').text('result ' + i);
                row.append(row1);
            }
            $('#someContainer table').append(row);
        }
        else
        {
            var table = $('<table></table>').addClass('foo');
            for(i=0; i<10; i++){
                var row = $('<tr></tr>');
                for(i=0; i<10; i++){
                    var row1 = $('<td></td>').addClass('bar').text('result ' + i);
                    table.append(row);
                    row.append(row1);
                }
            }
            $('#someContainer').append(table);
        }
    });
});

$（函数（）{
$（“#添加产品”）。单击（函数（）{
if（$（'#someContainer table'）。长度>0）
{
变量行=$（''）；
对于（i=0；i
$（函数（）{
$（“#添加产品”）。单击（函数（）{
变量表
if（$（'#someContainer'）.find（“table”）.length>0）{
table=$（'someContainer'）。查找（“table”）；
}否则{
表=$（''）.addClass（'foo'）；
}
对于（i=0；i<10；i++）{
变量行=$（''）；
对于（i=0；i<10；i++）{
var row1=$（''）.addClass（'bar'）.text（'result'+i）；
表.追加（行）；
行。追加（第1行）；
}
}
$（'#someContainer'）。追加（表）；
});
});

试试这个

gt=document.getElementById（'game_table'），
i=0，
frag=document.createDocumentFragment（），
tr=document.createElement（'tr'），
td=document.createElement（'td'）；
而（i基于@Olrac的答案

var tableBody = $('<table></table>').append($("<tbody>"));
$.each(dbRecords,function(index,record){
  row = $('<tr></tr>');
  $.each(record,function(i,cellValue){
    var rowData = $('<td></td>').text(cellValue);
    row.append(rowData);
  });
  tableBody.append(row);
});

$('#contentDiv').append(tableBody);

var tableBody=$（''）.append（$（''）；
$.each（数据库记录，函数（索引，记录）{
行=$（''）；
$.each（记录、函数（i、单元格值）{
var rowData=$（''）.text（cellValue）；
追加（rowData）；
});
tableBody.append（行）；
});
$（'#contentDiv'）.append（表体）；

这很有效

输出

<table>
  <tbody>
    <tr>
      <td>name</td>
      <td>age</td>
      <td>email</td>
      <td>data</td>
    </tr>
    <tr>
      <td>omar</td>
      <td>26</td>
      <td>omar@gmail.com</td>
      <td>123</td>
    </tr>
    <tr>
      <td>ali</td>
      <td>22</td>
      <td>ali@gmail.com</td>
      <td>456</td>
    </tr>
  </tbody>
</table>


名称
年龄
电子邮件
数据
奥马尔
26
omar@gmail.com
123
阿里
22
ali@gmail.com
456
row1=$（“”）
这不是一个好名字。你不明白你到底想要什么？详细说明。那么你想添加行吗？在表中动态添加行吗？是的，我想在表中动态添加行吗？你只能将1 ans标记为正确：）现在你在别人身上切换标记：D如果你喜欢他们的答案，你可以投票。不，我只希望表格只重复1次，每次我点击按钮，行或列都会重复。谢谢你帮了我很多忙谢谢它工作很好。小提琴似乎不见了。你需要将嵌套循环的I改为j。谢谢它的工作g很好谢谢谢谢工作很好谢谢
var tableBody = $('<table></table>').append($("<tbody>"));
$.each(dbRecords,function(index,record){
  row = $('<tr></tr>');
  $.each(record,function(i,cellValue){
    var rowData = $('<td></td>').text(cellValue);
    row.append(rowData);
  });
  tableBody.append(row);
});

$('#contentDiv').append(tableBody);

<table>
  <tbody>
    <tr>
      <td>name</td>
      <td>age</td>
      <td>email</td>
      <td>data</td>
    </tr>
    <tr>
      <td>omar</td>
      <td>26</td>
      <td>omar@gmail.com</td>
      <td>123</td>
    </tr>
    <tr>
      <td>ali</td>
      <td>22</td>
      <td>ali@gmail.com</td>
      <td>456</td>
    </tr>
  </tbody>
</table>