1.创建DOM 2.删除DOM 3.文档碎片 文档碎片可以提高DOM操作性能（理论上） 文档碎片(类似于一个口袋，先将多个元素放在口袋里，放完之后，再将口袋放到最终要插入的元素中): document.createDocumentFragment() ...
分类：
编程语言 时间：
2019-01-05 19:47:44
阅读次数：
155
讲这个方法之前，我们应该先了解下插入节点时浏览器会做什么。 在浏览器中，我们一旦把节点添加到document.body（或者其他节点）中，页面就会更新并反映出这个变化，对于少量的更新，一条条循环插入也会运行很好，也是我们常用的方法。代码如下： 但是，如果当我们要向document中添加大量数据时(比 ...
分类：
其他好文 时间：
2018-05-11 20:16:21
阅读次数：
145
每次对dom的操作都会触发"重排"，这严重影响到能耗，一般通常采取的做法是尽可能的减少dom操作来减少"重排" 处理方法：创建一个文档碎片将需要添加的大量元素 先添加到文档碎片中，再将文档碎片添加到需要插入的位置，大大减少dom操作，提高性能。 语法 document.createDocumentF ...
分类：
Web程序 时间：
2018-02-06 22:58:00
阅读次数：
213
DocumentFragment接口表示一个没有父级文件的最小文档对象。它被当做一个轻量版的Document使用，用于存储已排好版的或尚未打理好格式XML片段。最大的区别是因为DocumentFragment不是真实DOM树的一部分，它的变化不会引起DOM树的重新渲染的操作(reflow)，且不会导... ...
分类：
其他好文 时间：
2017-12-26 14:32:51
阅读次数：
95
大家都知道，大量的操作DOM会引起页面的渲染变慢，文档碎片是指一个临时的文档，把创建的dom放到文档里面，不要每次操作都操作DOM，提高页面的效率。下面我们就来看一下如何运用创建文档碎片。 首先，我们了解下向页面创建dom发生了什么。 for(var i=0;i<5000;i++){ var oSp ...
分类：
Web程序 时间：
2017-12-20 20:12:15
阅读次数：
208
DOM与浏览器 重排：改变页面内容 重绘：浏览器显示内容 1、添加顺序： --尽量在appendChild前添加操作 2、合并DOM操作： --利用cssText 3、缓存布局信息： 4、文档碎片： --createDocumentFragment() DOM与Javascript 1、浏览器会把D ...
分类：
其他好文 时间：
2017-08-21 00:10:48
阅读次数：
104
nodetype的十二种类型 1：元素节点 2：属性节点 3：文本节点 4：CDATA区段 5：实体应用元素 6：实体 7：表示处理指令 8：注释节点 9：最外层的Root element,包括所有其他节点 10：<!DOCTYPE...> 11:文档碎片节点 12：DTD中声明的符号节点 ...
分类：
其他好文 时间：
2017-07-24 14:45:28
阅读次数：
166
一、文档碎片 二、IO操作 一、功能实现核心：FileSystemObject 对象 要在javascript中实现文件操作功能，主要就是依靠FileSystemobject对象。 二、FileSystemObject编程 使用FileSystemObject 对象进行编程很简单，一般要经过如下的步 ...
分类：
其他好文 时间：
2017-06-29 10:11:51
阅读次数：
184
查文档碎片文档碎片:类似一个临时的文档，要所有要加的dom元素先放在这里，达到不要每次操作dom元素提高页面效率代码var d1 = new Date(); //创建十个段落,常规的方式 for(var i = 0 ; i < 1000; i ++) { var p = document.creat ...
分类：
其他好文 时间：
2017-06-29 09:58:44
阅读次数：
168
一、文档碎片 ? //文档碎片:类似一个临时的文档，要所有要加的dom元素先放在这里，达到不要每次操作dom元素 提高页面效率 var d1 = new Date(); //创建十个段落,常规的方式 for(var i = 0 ; i < 1000; i ++) { var p = document ...
分类：
其他好文 时间：
2017-06-29 09:55:22
阅读次数：
217
