Javascript jquerymultiple Append只追加最后一个

我想使用jQuery创建一个表。目前我有一个空的表体，我想使用一些jQuery来填充该表：

var$tr=$， $td=$； 风险值日期='2018-01-01' $td.textdate； $tr.add$td； $td.TEXT新年； $tr.add$td； $body.append$tr； 变量$tr1=$， $tr2=$， $tr3=$， $td=$； 风险值日期='2018-01-01'； $td.textdate； //实现它的各种方法 $tr1.附加$td.prop'outerHTML'； $tr2.追加$td.clone； $tr3.append$，{text:date}； $td.TEXT新年； $tr1.附加$td.prop'outerHTML'； $tr2.追加$td.clone； $tr3.append$，{text:'New Years'}； $body.append[$tr1、$tr2、$tr3]；

---

必须克隆$td，以便DOM将其视为新元素

var$tr=$， $td=$； 风险值日期='2018-01-01' $td.textdate； $tr.append$td.clone； $td.TEXT新年； $tr.append$td.clone； $body.append$tr； 如注释中所述，如果元素已经在DOM中，则.append只会移动它

现在在您的示例中，您将其附加到相同的位置，但也更改了文本

尝试使用该方法复制元素

var$tr=$； var$td=$； 风险值日期='2018-01-01'； $td.textdate； $tr.add$td； var secondCell=$td.clone.textNew Years； $tr.1；第二单元； $body.append$tr；

---

您可以在不使用jquery的情况下尝试下一个代码：

let tbody =  document.querySelector('#body');
let tr =  document.createElement('tr');
let td = document.createElement('tr');
td.textContent = '2018-01-01';;
let tdClone = td.cloneNode();
tdClone.textContent = "New Years";
tr.append(td,tdClone);
tbody.append(tr);

---

我认为这是正确的方法，因为您可以创建新的td而不是克隆创建的td，例如，这个td有特殊的类或属性，并且您只有在表中插入tr之后才能对DOM进行重新绘制

嗯。。。也许这是一种替代方法：

var texts = ["2018-01-01", "New Years"];

$.each(texts, function(i, val){
    $("<tr><td>"+val+"</td></tr>").appendTo("#body")
});

$。每个获取数组文本上的每个项目，将其包装在tr和td上，然后附加到body上的结果

---

Append不克隆元素。如果某个元素已经附加到dom或dom片段，它将分离该元素并将其放置在新位置。一个元素在DOM中只能有一个直接父元素。您可以通过附加$td.prop'outerHtml'来规避这个问题，或者在附加时生成不同的td元素，也许这个链接可以帮助您