Javascript createElement 和 appendchild 一步完成

Javascript createElement and appendchild in one step

本文关键字:一步 createElement appendchild Javascript      更新时间:2023-09-26

我想创建一个元素,然后在一个步骤中将其与其他元素一起附加。

var header = document.createElement("thead").appendChild(document.createElement("tr"));

为什么此代码输出唯一的 TR 而不是 Thead?

当我使用此代码时,它是正确的(thead + tr 在那里)

var header = CH.createElement("thead");
    header.appendChild(CH.createElement("tr"));

因为Node.appendChild()返回追加的子项...

var appendedChild = element.appendChild(child);

.. 你可以简单地引用孩子的parentNode,就像这样(小提琴样本):

var header = document.createElement("thead")
    .appendChild(document.createElement("tr"))
    .parentNode; // the row's parentNode, i.e.: thead

@antisanity有一个很好的解决方案。如果您的变量是预先声明的,另一种解决方案是执行此操作...

(header = document.createElement('thead'))
      .appendChild(document.createElement('tr'));

这可确保在.appendChild()之前对header进行分配。