iframe中有哪些缺点?
- iframe中会阻塞主页面的的Onload事件(过多会增加服务器的HTTP请求);
- 搜索引擎的检索程序无法解读这种页面,不利于搜索引擎优化;
- 页面样式调试麻烦,出现多个滚动条;
- 浏览器的后退按钮失效
- 产生多个页面,不易管理
- 不容易打印
- IFRAME和主页面共享连接池,而浏览器对相同域的连接有限制,所以会影响页面的并行加载。
使用iframe中之前需要考虑这两个缺点。如果需要使用iframe中,最好是通过JavaScript的动态给IFRAME SRC添加属性值,这样可以绕开以上两个问题
iframe的优缺点及改进方法
iframe的缺点
1、页面样式调试麻烦,出现多个滚动条;
2、浏览器的后退按钮失效;
3、过多会增加服务器的HTTP请求;
4、小型的移动设备无法完全显示框架;5、产生多个页面,不易管理;
6、不容易打印;
7、代码复杂,无法被一些搜索引擎解读。
iframe的优点:
1.iframe能够原封不动的把嵌入的网页展现出来。
2.如果有多个网页引用iframe,那么你只需要修改iframe的内容,就可以实现调用的每一个页面内容的更改,方便快捷。
3.网页如果为了统一风格,头部和版本都是一样的,就可以写成一个页面,用iframe来嵌套,可以增加代码的可重用。
4.如果遇到加载缓慢的第三方内容如图标和广告,这些问题可以由iframe来解决。
5.重载页面时不需要重载整个页面,只需要重载页面中的一个框架页(减少了数据的传输,增加了网页下载速度)
我在使用iframe过程中遇到的缺点:
1.为提高速度,采用 了动态创建和动态销毁iframe的方式,这样却导致了ie最后内存泄露 。
- //创建
- var iframe = document.createElement("iframe");
- iframe.src = pageURL;
- document.getElementById("contentDiv").appendChild(iframe);
- //销毁 tempFrame.src = blankPageURL;
- tempFrame.contentWindow.document.write('');
- tempFrame.contentWindow.document.clear();
- tempFrame.contentWindow.close();
- document.getElementById('contentDiv').removeChild(tempFrame);
- tempFrame = null;
- CollectGarbage();
IFRAME销毁是无法全部释放内存,所以最好不用IFRAME。如果确实要用IFRAME就使用你的第2种方式,尽量减少创建IFRAME。
建议使用iframe.contentWindow.location.replace(url)这个没有history或者 iframe.contentWindow.location = url.这个有history.
2 .用ajax,jquery.load()方法都可以实现要求。
把你本来想创建的iframe换成DIV。然后点击菜单的时候,调用ajax或者.load,调用后台,返回数据之后,直接填充到DIV里即可。
后台返回可以直接指向一个JSP画面。那2个方法可以直接取到填充完数据的HTML代码。
$.post("www.baidu.com", null, function(result) {
$("#div").html(result);
})
3.iframe在IE6下有内存泄漏,我解决IE6是这样,但这样还是会有些内存泄漏,但没不处理严重
/** * 跳转URL并回收资源 */ function gotoUrl( id, url ) { var el = document.getElementById( id ), iframe = el.contentWindow; if( el ) { if( $.browser.msie ) { el.src = 'about:blank'; try { iframe.document.write( '' ); iframe.close(); } catch( e ) { } } el.src = url; } }
*iframe和主页面共享连接池,而浏览器对相同域的连接有限制,所以会影响页面的并行加载。
使用iframe之前需要考虑这两个缺点。如果需要使用iframe,最好是通过javascript
动态给iframe添加src属性值,这样可以可以绕开以上两个问题。
1. 添加iframe时,直接去掉滚动条<iframe src="time " width=" "; frameborder="0";scrolling="no">; 2.用ajax 可以替代iframe的优点; 总而言之: 运维性网站或继承性开发的网站,可以使用iframe; 销售内,官网、展示性网站等建议不使用iframe; 标准的网页设计是不使用iframe的。