IFrame
iframe 用于在当前 HTML 文档中嵌入另一个文档。
你可以使用 iframe 进行显示:
- 同一域上的其他 HTML 页面;
- 另一个域上的其他 HTML 页面(参见下文 - 同源策略);
- PDF 文档(虽然 IE 可能有一些问题,这个问题可能会有所帮助);
你应该使用 iframe 作为最后的手段,因为它有书签和导航的问题,除了 iframe 总有更好的选择。这个问题应该可以帮助你更多地了解 iframe 的起伏。
同源政策
某些网站无法使用 iframe 显示,因为它们会强制实施名为 Same-origin policy 的策略 。这意味着 iframe 所在的站点必须与要显示的站点位于同一个域中。
此策略还适用于操作 iFrame 内部的内容。如果 iFrame 正在访问其他域中的内容,你将无法访问或操作 iFrame 内的内容。
W3C 上的 iframe 元素
sandbox
属性
sandbox
属性在设置时会为 iframe 添加额外的限制。空格分隔的令牌列表可用于放宽这些限制。
值 | 细节 |
---|---|
allow-forms |
允许提交表单。 |
allow-pointer-lock |
启用 JavaScript 指针 API。 |
allow-popups |
可以使用 window.open 或 <a target="_blank" 创建弹出窗口 |
allow-same-origin |
iframe 文档使用其真实来源而不是给予唯一的。如果与 allow-scripts 一起使用,iframe 文档可以删除所有沙盒,如果它来自与父文档相同的原点。 |
allow-scripts |
启用脚本。iframe 文档和父文档可以使用 postMessage() API 相互通信。如果与 allow-same-origin 一起使用,iframe 文档可以删除所有沙盒,如果它来自与父文档相同的原点。 |
allow-top-navigation |
允许 iframe 的内容更改顶级文档的位置。 |