js创建文档片段

创建文档片段方法document.createDocumentFragment()

//使用场景,用于优化性能(每次添加会造成渲染主线程工作),当在ul下创建许多li元素,可以遍历li相关数据,先存在文档片段里,最后添加到ul下
let ul = document.querySelector('ul')
function createLrcElements(listData) {
if(!listData || !Array.isArray(listData))return
  var frag = document.createDocumentFragment(); // 文档片段
  for (var i = 0; i < listData.length; i++) {
    var li = document.createElement('li');
    li.textContent = listData[i].words;
    frag.appendChild(li); // 改动了 dom 树
  }
  ul.appendChild(frag);
}

posted @ 2023-04-02 17:05  君归何时  阅读(84)  评论(0)    收藏  举报