Javascript createElement和appendchild在一個步驟中

Question

我想創建一個元素，然後在一個步驟中添加其他元素。

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

爲什麼此代碼只輸出TR而不是Thead？

當我使用此代碼，那麼它的正確（THEAD + TR在那裏）

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

Answer 1

因爲Node.appendChild()回報附屬兒童 ...

var appendedChild = element.appendChild(child); 

..你可以直接引用孩子的parentNode像這樣（sample fiddle）：

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

Answer 2

@antisanity有一個很好的解決方案。如果你的變量是預先聲明的另一個解決方案是做到這一點...

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

這確保了分配給header的.appendChild()之前發生。