开发者问题收集

Javascript 一步完成 createElement 和 appendchild

2012-06-28
2126

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

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

为什么此代码仅输出 TR 而不是 Thead?

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

var header = CH.createElement("thead");
    header.appendChild(CH.createElement("tr"));
2个回答

因为 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
canon
2012-06-28

@antisanity 有一个很好的解决方案。如果您的变量是预先声明的,另一个解决方案是这样做...

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

这可确保对 header 的分配发生在 .appendChild() 之前。

2012-06-28