DocumentFragment

定义:创建一个新的空白的文档片段

let fragment = document.createDocumentFragment();

一般用法:将元素追加到 fragment 中,再将 fragment 追加到DOM树上,并且 fragment 被自身子元素代替,即DOM树中不会显示 fragment, 只显示 fragment 中的元素

var ulinfo = document.createElement('ul');
var fragment = document.createDocumentFragment();

for(var i = 0;i < 6;i++){
    var li = document.createElement('li');
    fragment.appendChild(li);
}

ulinfo.appendChild(fragment);

优点:会带来更好的性能。因为文档片段存在于内存中,而不是在DOM树中。在动态添加元素时,使用文档片段不会引起页面回流(对元素位置和几何上的运算),可以使性能更优。

你可能感兴趣的:(JavaScript)