javascript innerHTML 大数据量加载 导致IE 内存溢出 的解决办法

在做 ajax 滚动加载的时候,越到后面 数据量越大,使用obj.innerHTML+=row添加到页面的时候,出现ie内存不足的情况,此时使用createDocumentFragment,创建一个文档碎片,把所有的新节点附加其上,然后把文档碎片一次性添加到document中,内存节省明显。 

 

<script type="text/javascript">


 function append(parent, text) {
 if (typeof text === 'string') {
 var temp = document.createElement('div');
 temp.innerHTML = text;
 // 防止元素太多 进行提速
 var frag = document.createDocumentFragment();
 while (temp.firstChild) {
frag.appendChild(temp.firstChild);
}
parent.appendChild(frag);
}
 else {
parent.appendChild(text);
}
}

 window.onload = function() {

 var text = '<h4>Welcome!</h4><ul><li>A</li><li>B</li><li>C</li></ul><p>Hello, World</p>';
 append(document.body, text);

};

</script>

 

posted @ 2016-05-30 10:08  有梦就能实现  阅读(1036)  评论(0编辑  收藏  举报