如何将DOM元素附加到JavaScript中的空元素中？

Question

我有一堆对象返回一个DOM树，然后我用它来追加到一个元素。例如，

var elem = document.createElement('div'); 
elem.appendChild(callSomePrototypesMethod()); 
elem.appendChild(callSomePrototypesMethod()); 
elem.appendChild(callSomePrototypesMethod()); 

，我将最终结束了在类似：

<div> 
<div id="...">...</div> 
<div id="...">...</div> 
<div id="...">...</div> 
</div> 

这三个资料核实被第三方代码创建的，我在这里包装他们在我的DIV标签，但什么我想反而是刚刚它们添加到一个空的元素，但它不工作：

var elem = document.createElement(''); 
elem.appendChild(callSomePrototypesMethod()); 
elem.appendChild(callSomePrototypesMethod()); 
elem.appendChild(callSomePrototypesMethod()); 

预期结果：

<div id="...">...</div> 
<div id="...">...</div> 
<div id="...">...</div> 

我不知道如果这使得任何意义给你，但我需要使用DOM，我不能把任何其他元素中的那些内容...

Answer 1

这就是document fragments是。您可以通过document.createDocumentFragment()创建一个新片段，并将其用作单个元素。

Answer 2

如果你想直接在文档的正文中插入的specifieds元件（未像“DIV”的其他元素内），尽量

document.body.appendChild(callSomePrototypesMethod());

有一个关于“document.body的音符。 appendChild'在IE中。请参阅http://danielsaidi.wordpress.com/tag/documentbodyappendchild/。