初识javascript 文档碎片

  后来是一技术群问到以下一段代码:

  

复制代码 代码如下:

  function html2node(s) {

  var d = document.createElement('div');

  d.innerHTML = s;

  if (d.childNodes.length == 1)

  return d.childNodes[0];

  var df = document.createDocumentFragment();

  while (d.firstChild)

  df.appendChild(d.firstChild);

  return df;

  }

  大概的原理都明白,比较困惑的是为什么要用 document.createDocumentFragment 呢?

  后来在网上搜索了一下相关资源才知道,document.createDocumentFragment 是用来创建文档碎片的。

  当我们需要大量 appendChild 页面元素时,可以先将这些元素 appendChild 进document.createDocumentFragment。

  然后只需 appendChild 文档碎片到页面就可以了。这样就不用多次刷新页面达到性能优化的目的。上面那个代码我觉得用到文档碎片是多余的。