document.createDocumentFragment  用于创建文档对象,创建好的对象存在于内存中(不会引起回流,对元素位置和几何上的运算),不是附着在DOM树上,所以有更好的性能 可将该文档片段插入DOM树中,

例子:

var element  = document.getElementById('ul'); // assuming ul exists
var fragment = document.createDocumentFragment();
var browsers = ['Firefox', 'Chrome', 'Opera',
'Safari', 'Internet Explorer']; browsers.forEach(function(browser) {
var li = document.createElement('li');
li.textContent = browser;
fragment.appendChild(li);
}); element.appendChild(fragment);

每天学一点---document.createDocumentFragment的更多相关文章

  1. 关于javascript document.createDocumentFragment() 替代insertCell、insertRow这种每次都使用大量的资源导致浏览器崩溃

    documentFragment 是一個無父對象的document對象他支持以下DOM2方法: appendChild, cloneNode, hasAttributes, hasChildNodes ...

  2. 浅析document.createDocumentFragment()与js效率

    对于循环批量操作页面的DOM有很大帮助!利用文档碎片处理,然后一次性append,并且使用原生的javascript语句操作 document.createDocumentFragment()说白了就 ...

  3. document.createDocumentFragment 方法

    基本概念 document.createDocumentFragment 方法会创建一个 DocumentFragment 对象,该对象是一个存在于 DOM 树之外的 DOM 节点.它有一个非常有用的 ...

  4. document.createDocumentFragment()运行效率

    createDocumentFragment作用是什么? 快速响应,提高效率,提升用户体验. 调用document.body.append(),每调用一次都要刷新页面 一次.效率就低了. 用docum ...

  5. document.createDocumentFragment 以及创建节点速度比较

    document.createDocumentFragment document.createDocumentFragment()方法创建一个新空白的DocumentFragment对象. Docum ...

  6. 学一点 MYSQL 双机异地热备份—-MYSQL主从,主主备份原理及实践

    简单介绍mysql双机,多机异地热备简单原理实战. 双机热备的概念简单说一下,就是要保持两个数据库的状态自动同步.对任何一个数据库的操作都自动应用到另外一个数据库,始终保持两个数据库数据一致. 这样做 ...

  7. 关于document.createDocumentFragment()(转)

    documentFragment 是一个无父对象的document对象. 他支持以下DOM2方法: appendChild, cloneNode, hasAttributes, hasChildNod ...

  8. JS性能优化之创建文档碎片(document.createDocumentFragment)

    讲这个方法之前,我们应该先了解下插入节点时浏览器会做什么.         在浏览器中,我们一旦把节点添加到document.body(或者其他节点)中,页面就会更新并反映出这个变化,对于少量的更新, ...

  9. 【js基础修炼之路】--创建文档碎片document.createDocumentFragment()

          讲这个方法之前,我们应该先了解下插入节点时浏览器会做什么.         在浏览器中,我们一旦把节点添加到document.body(或者其他节点)中,页面就会更新并反映出这个变化,对于 ...

随机推荐

  1. SQL Server:INFORMATION_SCHEMA.columns 与sys.columns 与 syscolumns对比

    sys.columns视图 sys.columns是SQL Server从2005版本起引入的新的系统级视图.相关链接如下: Mapping SQL Server 2000 System Tables ...

  2. 使用Socket开发http服务器时碰到的问题及处理方法

    1. 前言 ​ 最近正在为QA测试开发压力测试框架,要为测试人员提供一个结果的图形化表示界面.为了展示数据的及时性,不得不使用lua语言实现一个http服务器.由于http服务需要提供的服务比较简单 ...

  3. BZOJ 1113 海报 单调栈

    题目链接: https://www.lydsy.com/JudgeOnline/problem.php?id=1113 题目大意: N个矩形,排成一排. 现在希望用尽量少的矩形海报Cover住它们. ...

  4. os.path.md

    os.path 我们可以利用os.path模块提供的函数更容易地在跨平台上处理文件. 即使我们的程序不是用于夸平台, 也应该使用os.path来让路径名字更加可靠. Parsing Paths os. ...

  5. Java之时间转换

    SimpleDateFormat sdf = new SimpleDateFormat("yyyy-MM-dd HH:mm:ss"); Date date = sdf.parse( ...

  6. Python2.7-zlib

    zlib 模块,提供了压缩和解压缩的函数,都是对字符串进行操作的,可以理解为是各种不同类型的数据经过处理成为字符串或是二进制字符串,再进行压缩解压缩.是和 gzip 相兼容的压缩模块 模块方法: zl ...

  7. Python2.7-weakref

    weakref 模块,允许创建对象的弱引用,被弱引用的对象其引用计数不变,对象的引用计数为0时就会被垃圾清理机制释放内存空间,此时对其的弱引用也会失效.在对象会被交叉引用,需要释放内存空间时常用. 模 ...

  8. jquery jqzoom插件练习

    <!DOCTYPE html> <html lang="en" xmlns="http://www.w3.org/1999/xhtml"> ...

  9. odoo 打印单

    <td style="word-wrap:break-word;width:20%;font-size:16"> <t t-foreach="l.pro ...

  10. Git中使用amend解决提交冲突

    问题描述       场景:当你提交的时候,发现跟要合并的流有冲突,你需要解决完冲突再次提交. 如果在SVN时代,你可以直接在本地解决完冲突再提交就可以了,因为SVN会把正确的代码先提交到服务器,至于 ...