iframe如何动态创建及释放其所占内存

iframe如何动态创建及释放其所占内存

最近参与一个项目的开发，由于项目是基于浏览器的胖客户端（RIA）应用程序，页面中大量调用iframe。后期测试发现浏览器内存一直居高不下，而且打开iframe页面越多内存占用越大，在IE系列浏览器中尤其明显。所有打开的iframe页面即使关闭了，内存使用也没有明显的下降，IE浏览器在内存占用达到400M左右就变得很卡。分析发现是iframe没有释放造成的，于是对所有已关闭的iframe所占用的内存进行释放，虽然不能完全释放，但是iframe内存占用量不会一直增长，整个应用内存使用量控制在150M左右。

/**

* 动态创建iframe

* @param dom 创建iframe的容器，即在dom中创建iframe。dom可以是div、span或者其他标签。

* @param src iframe中打开的网页路径

* @param onload iframe加载完后触发该事件，可以为空

* @return 返回创建的iframe对象

*/

function createIframe(dom, src, onload){

//在document中创建iframe

var iframe = document.createElement("iframe");

//设置iframe的样式

iframe.style.width = '100%';

iframe.style.height = '100%';

iframe.style.margin = '0';

iframe.style.padding = '0';

iframe.style.overflow = 'hidden';

iframe.style.border = 'none';

//绑定iframe的onload事件

if(onload && Object.prototype.toString.call(onload) === '[object Function]'){

if(iframe.attachEvent){

iframe.attachEvent('onload', onload);

}else if(iframe.addEventListener){

iframe.addEventListener('load', onload);

}else{

iframe.onload = onload;

}

}

iframe.src = src;

//把iframe加载到dom下面

dom.appendChild(iframe);

return iframe;

}

/**

* 销毁iframe，释放iframe所占用的内存。

* @param iframe 需要销毁的iframe对象

*/

function destroyIframe(iframe){

//把iframe指向空白页面，这样可以释放大部分内存。

iframe.src = 'about:blank';

try{

iframe.contentWindow.document.write('');

iframe.contentWindow.document.clear();

}catch(e){}

//把iframe从页面移除

iframe.parentNode.removeChild(iframe);

}

版权声明：本文内容由网络用户投稿，版权归原作者所有，本站不拥有其著作权，亦不承担相应法律责任。如果您发现本站中有涉嫌抄袭或描述失实的内容，请联系我们jiasou666@gmail.com 处理，核实后本网站将在24小时内删除侵权内容。