Vue之文档碎片

一般我们在处理dom的时候，不建议一个一个元素进行修改，而且把需要操作的dom节点一次性从页面取出，放入内存，然后在内存里面对这些dom统一进行操作，然后再挂载回去。这样能够提高性能，而且也让最大限度降低了页面重流和重绘的次数。

创建了一个文档碎片，然后把aa里面的所有第一级的子元素加到文档碎片里面。然后遍历整个文档碎片，如果是元素节点的，拼接上内容，最后把文档碎片append回原来的元素上面。

/**
 * 把传入的标签的字标签全部搞进去内存中安排
 * @param el
 * @returns {DocumentFragment}
 */
node2Fragment: function(el) {
    //搞出一个文档碎片
    var fragment = document.createDocumentFragment();
    var child;

    /**
     * 将原生节点拷贝到fragment
     * 过程：
     *      1.取el标签第一个子标签
     *      2.传入内存文档碎片【ok，传入内存文档碎片后，第一个子标签就不见了】
     *      3.循环1,2
     */
    while (child = el.firstChild) {
        fragment.appendChild(child);
    }

    return fragment;//把搞好的文档碎片返回
},