javascript - 仅限 html 的 AppendChild

Question

我想将 Html 作为子元素附加到元素中，我尝试过:

$.each(data, function(i, field){
    var tbody = document.getElementsByTagName('tbody')[0];
    tbody.appendChild('<tr><td>'+ field.name +'</td><td>' + field.vorname + '</td><td>' + field.geburtsdatum + '</td><td>' + field.strasse + '</td><td>' + field.plz + '</td></tr>');
});

但不知怎的，我得到了这个错误:

 Uncaught NotFoundError: Failed to execute 'appendChild' on 'Node': The new child element is null. 

我该如何解决这个问题？谢谢

Answer 1

appendChild() 将节点作为参数，尝试 jQuery 的append() 代替

var $tbody = $('tbody').eq(0);
$.each(data, function (i, field) {
    $tbody.append('<tr><td>' + field.name + '</td><td>' + field.vorname + '</td><td>' + field.geburtsdatum + '</td><td>' + field.strasse + '</td><td>' + field.plz + '</td></tr>');
});

<小时/>

正如Json所说，最好先创建html然后附加它，所以尝试一下

var array = $.map(data, function (field, i) {
    return '<tr><td>' + field.name + '</td><td>' + field.vorname + '</td><td>' + field.geburtsdatum + '</td><td>' + field.strasse + '</td><td>' + field.plz + '</td></tr>';
});

$('tbody').eq(0).append(array.join(''));