如何添加新的<td>至第n<tr>使用jquery

您必须将单元格添加到行中，而不是直接添加到表中：

//fill grid using jquery
for (var i = 0; i < 3; i++) {
  //add a row
  var row = $("<tr>");
  $("#grid").append(row);
  //3 rows, 3 columns 
  for (var j = 0; j < 3; j++) {
    //write cell
    var cell = $("<td>").data("id", i * 3 + j);
    row.append(cell);
  }
}

您可以通过两种方式实现

首先只是对代码进行编辑。

 for ( i = 0 ; i < 3 ; i++ ) {
            //add a row
        $("#grid").append("<tr>");
            //3 rows, 3 columns 
        for ( var j = 0 ; j < 3 ; j++ ) {
           var td = $("<td>").data("id", i * 3 + j );
            $("#grid"),find("tr:eq("+i+")").append(td);
        }
    }

第二，使用变量存储TR

for ( i = 0 ; i < 3 ; i++ ) {
        //create row and store that in variable
    var tr = $('<tr>');

    for ( var j = 0 ; j < 3 ; j++ ) {

        tr.append("<td>").data("id", i * 3 + j );
    }
    $('#grid').append(tr);
}

试试这样的东西。

for ( i = 0 ; i < 3 ; i++ ) {
        //add a row
    var tr = $('<tr>');
        //3 rows, 3 columns 
    for ( var j = 0 ; j < 3 ; j++ ) {
        td = $('<td>');
        td.text(((i*3) + j) + 1);
            //write cell
        tr.append(td);
    }
    $('#grid').append(tr);
}

工作小提琴：http://jsfiddle.net/6SU86/