jquery - 如何将所有 td 包装成一个 tr 到我的 JQuery 代码？

Question

var url = 'json/result.json';
$(document).ready(function() {
    $.getJSON(url, function(data) {
        $.each(data.video, function(index, video) {
            var row = $("<tr></tr>");                   
            $('#userDataGrid').append('<td>' + video.id + '</td>');
            $('#userDataGrid').append('<td>' + video.name + '</td>');
            $('#userDataGrid').append('<td>' + video.url + '</td>');
            $.each(video.author.data, function(index, author) {
                $('#userDataGrid').append('<td> Author: ' + author.name_author + '</td>');
            });
            $('#userDataGrid').append('<br/>');
        });
    });
    $("#userDataGrid p").addClass("selected highlight");
    console.log("========================");
    //console.log(data);
    console.log("========================");
});

Answer 1

var row = $("<tr></tr>");                   
row.append('<td>Foo</td>');
row.append('<td>Bar</td>');
..
$('#userDataGrid').append(row);

但这是正确使用附加的方法：

var row = '<tr>';
row += '<td>Foo</td>';
row += '<td>Bar</td>';
..
row += '</tr>';
$('#userDataGrid').append(row);

资源：

• http://www.learningjquery.com/2009/03/43439-reasons-to-use-append-correctly

Answer 2

 $.getJSON(url, function(data) {
    $.each(data.video, function(index, video) {
      var row_str= '<tr>';                   
      row_str += '<td>' + video.id + '</td>';
      row_str += '<td>' + video.name + '</td>';
      row_str += '<td>' + video.url + '</td>';

          $.each(video.author.data, function(index, author) {
              row_str += '<td> Author: ' + author.name_author + '</td>';
          });
      row_str += '<br/>';
      row_str += '</tr>';
      $('#userDataGrid').append(row_str);
    });
});

Answer 3

你可以使用wrapAll方法。

$.each(data.video, function(index, video) {
    // ...
    $('#userDataGrid > td').wrapAll('<tr></tr>')
});