JavaScript追加，创建和添加属性

Question

我有一个问题，在javascript中创建元素

什么是最好的方法，例如为新创建的元素添加属性以及更好的性能？

所以问题如下：

1. 创建元素
2. 设置元素的id属性
3. 追加
4. 然后通过重新呈现其ID并添加新属性来使用创建的元素

OR

1. 创建元素
2. 设置相关元素的各种属性
3. 追加

谢谢！

编辑： 大家好，

做完你们给我推荐的一切之后， 我得出结论，第二种选择是最好的。

1. 创建元素
2. 设置相关元素的各种属性
3. 追加

JSperf测试：

• http://jsperf.com/javscript-append-performance
• http://jsperf.com/document-fragment-vs-docoment-createelement2

Answer 1

我会像这样使用 DocumentFragment

var element= document.createDocumentFragment();

然后使用element执行您需要的操作，然后将其附加到DOM。

来自https://developer.mozilla.org/en-US/docs/Web/API/document.createDocumentFragment

  

由于文档片段在内存中而不是主DOM树的一部分，因此将子项附加到它不会导致页面重排（计算元素的位置和几何）。因此，使用文档片段通常会带来更好的性能。

Answer 2

我会这样做：

1. 创建元素（可能设置属性）
2. 追加元素
3. 设置属性，将子项追加到元素以及您想要执行的任何其他操作。