对我来说,iframe是纯粹的邪恶(好吧,也许不那么纯粹)。他们似乎遇到了很多麻烦。是的,您的整个网站将加载一次,然后您只需加载一个页面。但人们为此目的发明了AJAX。
我在iframe
找到的最大问题之一就是我无法将链接粘贴到其中一个子页面,因为URL从未更改过(是的,我知道有一个解决方法)。其次,网络搜索引擎可能无法正确索引网站。
有时这些网站的可访问性更差,有些浏览器甚至可以不正确地显示它们。
有更好的方法来设计没有(i)帧的布局。每天我都可以看到有人在问这些问题,比如“如何使用jQuery访问iframe?”。
那么iframe有什么好处?还有什么理由继续使用它们?我只是想知道为什么:)
(因为它不是一个真正的问题,它是一个CW)
答案 0 :(得分:94)
我可以想到两个原因(目前)为什么人们仍会使用iframe代替AJAX:
1)iframe绕过跨域原始策略(图像,脚本和样式不会)。这对于相对安全地从其他域名中提取站点/内容非常有用。基本上,这允许能够直观地显示来自其他域的数据,而不会让他们无限制地访问您的页面(就像JSONP能够做的那样)。
2)您可以从iframe中加载多种类型的资源,而不仅仅是某些mime类型(您相对限制为application / javascript,application / x-javascript,text / css,text / xml,image / png,image / jpeg,带脚本的图像/ gif,XHR,图像和来源)。例如,如果我想向您显示PDF,我可以打开一个iframe,然后让Adobe Reader插件显示该文件。另外,在同一个域中,如果我想将脚本,样式和图像一起管道化(在页面上内嵌,图像必须是数据URI),我可以使用iframe完成此操作(如果它在同一个域中)域,端口和协议我也可以使用JavaScript访问它。
您知道Gmail是一组iframe吗?可见部分只是巧妙的定位。此外,许多OAuth实施(Twitter,Facebook,Google,Yahoo!)通常使用iframe将其域中的用户与成功的身份验证URL相关联(用于登录后)。
答案 1 :(得分:18)
IFRAME用于将第三方内容嵌入并隔离到网站中。
大多数网络广告解决方案都基于iframe - 因为它们在屏幕上提供安全性(跨域策略)和隔离矩形,可以通过第三方内容和脚本完全管理(常见的用例是广告)。
IFRAMES的另一个现代用途是对AJAX应用程序的历史管理(常见的后退按钮解决方法)。
FRAME是IFRAMES的糟糕版本。他们的使用正在下降。
答案 2 :(得分:15)
如果用户禁用了javascript,则当ajax没有时,iframe将会起作用。考虑到人们使用像NoScript这样的东西,这不是不可能的。
答案 3 :(得分:7)
我在ajax网站上使用它们,当我需要上传文件而不重新加载页面时。
答案 4 :(得分:3)
使用它们有很多技术原因(特别是Dan Beam提到的安全问题)。
你不应该做的是使用iframe“喜欢帧”,通过仅更新iframe来导航到新页面。正如您所说,这会阻止导航成为可收藏/可链接,响应常规导航按钮,并提供有用的链接功能,例如open-in-new-tab。
但这并不是iframe所特有的。通过使用XMLHttpRequest
获取新内容并将其写入主内容div innerHTML
,您可以看到导航完成的页面越来越多。通常这是通过jQuery load()
和聪明聪明的幻灯片动画来完成的。这会破坏导航,就像iframe一样使用框架,或者确实是老式框架集。令人遗憾的是,许多网络作者都在使用这种策略,认为它是一种超现代的网页设计方法,当它真的只是昨天被鄙视的框架集的新皮肤时。
您可以在两种情况下解决这个问题,但这意味着您必须将视图状态存储在#
片段标识符部分中,并支持正确的哈希导航,这并非易事。即便如此,你仍然遇到像搜索引擎这样的非JS代理商的问题;您最终必须使用基于?
和#
的并行导航来支持这两者。这是一种痛苦,大多数都不会打扰。
答案 5 :(得分:2)
从HTML 5开始,框架集已过时,有时您需要在网站中拥有另一个网站的框架。 AJAX也只能做这么多。尝试通过https将文件上传到其他域中的网站,而不使用iframe。 AJAX不会帮助你。
答案 6 :(得分:2)
我仍然看到iframe正在大公司中使用,在那里他们提供单一标志,其中注入有关经过身份验证的用户的标头信息,然后通过iframe将其传递给实际应用程序。由于围绕iframe的“门户”处理所有特定的身份验证详细信息,因此它背后的应用程序不需要为每个应用程序提供实现,这使得开发团队更容易实现,并且只需一个地方来监视和调整身份验证详细信息用户。
答案 7 :(得分:2)
除了其他原因,我在我的应用程序中有一个iframe
的特定用法。不幸的是,我的目标浏览器是Internet Explorer 6
。我需要在我的网页中修复页脚和页眉。该页面的主要部分是可滚动的。
但是,有bug in IE6我无法使用div
CSS属性在select
元素的顶部显示z-index
元素。因此,我需要创建一个iframe
,用作黑客来避免这个问题。
当然,这是iframe
的特定用法,仅关注IE6
......
答案 8 :(得分:1)
我正在建立一个社交网络,我看到iframe对于小部件有用,可以放在其他人的网站上显示为迷你个人资料或与远程服务器上的内容集成。似乎是构建它的最简单方法。我知道有些小部件使用JavaScript。同样使用iframe方法,会话与正常访问网站一样,对于类似按钮非常棒。
答案 9 :(得分:0)
Javascript WYSIWYG编辑器使用iframe,因为这是最简单和最好的方法。例如,TinyMCE使用它:
答案 10 :(得分:0)
许多格式化文本编辑器(例如TinyMCE,HTMLArea)实现为iframe。
答案 11 :(得分:0)
对于某些情况,iFrame可以作为X域请求,或通过参数将数据发布到源。但是当我想跨域访问数据时,我更喜欢使用CSS文件 - 他们可以接受参数,设置cookie,向页面添加内容(:之前和之后)并给出视觉反馈。