文档碎片createDocumentFragment

//先创建文档碎片

var oFragmeng = document.createDocumentFragment(); 


for(var i=0;i<10000;i++)

{ 

    var op = document.createElement("span"); 

    var oText = document.createTextNode(i); 

    op.appendChild(oText); 

    //先附加在文档碎片中

    oFragmeng.appendChild(op);  

} 


//最后一次性添加到document中

document.body.appendChild(oFragmeng); 
/// 平常的使用
var oDiv = document.createElement("div"); 


for(var i=0;i<10000;i++)

{ 

    var op = document.createElement("span"); 

    var oText = document.createTextNode(i); 

    op.appendChild(oText); 


    oDiv.appendChild(op);  

} 
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 文档碎片 —— 在你需要用js创建多个节点时,可以使用document.createDocumentFragmen...
    行不离书阅读 2,312评论 0 0
  • js 在插入元素时,可以直接插入,也可以先把元素存入文档碎片,在进行插入,但是文档碎片只是在理论中可以提高操作性能...
    发光驴子阅读 3,244评论 0 0
  • 应用场景 向document中添加大量节点时,每次插入都会让页面渲染一次,很耗费性能,如下: 这时碎片就十分有用了...
    Gary嘉骏阅读 3,674评论 0 0
  • 有一段HTML字符串,想插入到页面中,通常来讲要如下几个步骤才能完成: 上面的每次循环都会导致浏览器的回流和重绘,...
    NO3340971阅读 3,097评论 0 0
  • 我想飞上天空 哪怕是一只飞鸟 我想入世清秀 纵然恋如潮水 我的想法如此的小 你却虐过我微弱的火焰 夜空的繁星 光芒...
    吴歌歌阅读 1,371评论 0 0