iframe标签的sandbox属性

简介: iframe标签的sandbox属性

定义

如果被规定为空字符串(sandbox=“”),sandbox 属性将会启用一系列对行内框架中内容的额外限制。

sandbox 属性的值既可以是一个空字符串(应用所有的限制),也可以是空格分隔的预定义值列表(将移除特定的限制)。

用法

  1. sandbox=“”
      应用所有限制
  2. sandbox=“allow-same-origin”
      允许 iframe 内容被视为与包含文档有相同的来源。
  3. sandbox=“allow-top-navigation”
      允许 iframe 内容从包含文档导航(加载)内容。
      可用于禁用外部网站的JS跳转、target=“_parent”、target="_top"等
  4. sandbox=“allow-forms”
      允许表单提交。
  5. sandbox=“allow-scripts”
      允许脚本执行,即允许iframe运行脚本(但不创建弹出窗口)。
      可用于禁用外部网站的JS
  6. sandbox=“allow-popups”
      允许弹出窗口(如window.open,target=“_blank”)。
  7. sandbox=“allow-scripts”
      允许弹出窗口逃离沙箱:允许一个沙箱文件打开新窗口不强制使用沙盒。

实例

例如:此iframe只允许加载script,其他的全部限制。

<iframe width="930" height="630" sandbox="allow-scripts" src="http://www.baidu.com"></iframe>

遇到的问题:

iframe使用sandbox属性后,即使将所有值设为允许,页面中的flash也无法使用

参考:

HTML <iframe> 标签的 sandbox 属性


相关文章
|
5月前
HTML中的<iframe>标签及其属性
HTML中的<iframe>标签及其属性
|
4月前
|
前端开发 JavaScript 应用服务中间件
iframe动态操作标签分享
iframe动态操作标签分享
38 0
|
6月前
|
SEO
iframe标签是做什么用的
iframe标签是做什么用的
38 0
|
12月前
|
存储 JavaScript 前端开发
Jquery 如何获取子元素。如何找到所有 HTML select 标签的选中项。jQuery 里的 ID 选择器和 class 选择器有何不同
Jquery 如何获取子元素。如何找到所有 HTML select 标签的选中项。jQuery 里的 ID 选择器和 class 选择器有何不同
137 1
|
12月前
|
JavaScript 前端开发
vue2.0 + element-ui +iframe在页面 中嵌入外部网站
vue2.0 + element-ui +iframe在页面 中嵌入外部网站
295 0
|
JavaScript 前端开发
js内联外联样式的获取,父页面获取iframe框架元素返回null
js内联外联样式的获取,父页面获取iframe框架元素返回null
|
安全 UED
HTML <iframe> 标签的常用属性--详解(附加代码)
HTML <iframe> 标签的常用属性--详解(附加代码)
164 0
|
前端开发 JavaScript
使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式
使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式
223 0
使用 jQuery 基本选择器获取页面元素,然后利用 jQuery 对象的 css() 方法动态设置 <span> 和 <a> 标签的样式
|
前端开发 JavaScript
javascript 模态框实现 -- :target 伪元素实现
在前端开发中模态框(对话框、弹出框)是很常见的场景,这篇文章介绍使用 :target 伪元素的方式实现。
218 0
javascript 模态框实现 -- :target 伪元素实现
下一篇
无影云桌面