一个文档片段可以多次使用吗
一个文档片段可以多次使用吗
提问于 2011-08-17 23:48:46
我想知道是否可以使用单个文档片断在DOM中插入多个片断，还是必须为每个要插入的元素创建新的片断。
我可以做下面的例子吗：
var frag = document.createDocumentFragment(),
div = document.createElement('div'),
section = document.createElement('section'),
header = document.createElement('header'),
divFrag = frag.appendChild(div),
sectionFrag = frag.appendChild(section),
headFrag = frag.appendChild(header);非常感谢
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-08-17 23:52:49
只需注意一下代码：appendChild返回插入的DOM元素，因此：
divFrag = frag.appendChild(div)将返回div。即div === divFrag。
要回答您的问题，您可以重用文档片段。
例如，如果您想要将所有元素附加到<body>，您可以这样做：
frag.appendChild(div);
frag.appendChild(section);
frag.appendChild(header);
document.body.appendChild(frag); // append all three elems at once to the body
// frag is now an empty fragment, ready for re-useStack Overflow用户
发布于 2011-08-17 23:51:00
如果您需要设置id属性，则不能重用完全相同的dom，因为ids必须是唯一的。
您可以使用某种类型的模板，从中可以获得结构相似但值不同的自定义dom片段。
Stack Overflow用户
发布于 2011-08-17 23:52:49
不，这将产生与以下相同的结果：
var frag = document.createDocumentFragment(),
div = document.createElement('div'),
section = document.createElement('section'),
header = document.createElement('header');
frag.appendChild(div);
frag.appendChild(section);
frag.appendChild(header);
var divFrag = div, sectionFrag = section, headFrag = header;因此，您的片段将以三个元素结束，而divFrag、sectionFrag和headFrag变量将根本不是片段。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/7095723
复制相关文章
相似问题
腾讯云开发者
