iframe如何动态创建及释放其所占内存
最近参与一个项目的开发,由于项目是基于浏览器的胖客户端(RIA)应用程序,页面中大量调用iframe。后期测试发现浏览器内存一直居高不下,而且打开iframe页面越多内存占用越大,在IE系列浏览器中尤其明显。所有打开的iframe页面即使关闭了,内存使用也没有明显的下降,IE浏览器在内存占用达到400M左右就变得很卡。分析发现是iframe没有释放造成的,于是对所有已关闭的iframe所占用的内存进行释放,虽然不能完全释放,但是iframe内存占用量不会一直增长,整个应用内存使用量控制在150M左右。
/** *动态创建iframe *@paramdom创建iframe的容器,即在dom中创建iframe。dom可以是div、span或者其他标签。 *@paramsrciframe中打开的网页路径 *@paramonloadiframe加载完后触发该事件,可以为空 *@return返回创建的iframe对象 */ functioncreateIframe(dom,src,onload){ //在document中创建iframe variframe=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)==='[objectFunction]'){ if(iframe.attachEvent){ iframe.attachEvent('onload',onload); }elseif(iframe.addEventListener){ iframe.addEventListener('load',onload); }else{ iframe.onload=onload; } } iframe.src=src; //把iframe加载到dom下面 dom.appendChild(iframe); returniframe; } /** *销毁iframe,释放iframe所占用的内存。 *@paramiframe需要销毁的iframe对象 */ functiondestroyIframe(iframe){ //把iframe指向空白页面,这样可以释放大部分内存。 iframe.src='about:blank'; try{ iframe.contentWindow.document.write(''); iframe.contentWindow.document.clear(); }catch(e){} //把iframe从页面移除 iframe.parentNode.removeChild(iframe); }