HTML5 iframe sandbox

<!DOCTYPE html>
<html>
<body> <iframe src="demo_iframe_sandbox.html" sandbox="allow-scripts">
<p>您的浏览器不支持 iframes.</p>
</iframe> <p>"获得日期和时间" 按钮会在行内框架中运行一段脚本。</p>
<p>由于 sandbox 属性被设置为空字符串 (""),行内框架的内容不允许运行脚本。</p>
<p>如果向 sandbox 属性添加 "allow-scripts",则允许运行 JavaScript。</p>
<p><b>注释:</b>IE 9 以及更早的版本不支持 sandbox 属性,Opera 12 以及更早的版本也不支持该属性。</p> </body>
</html>

http://www.runoob.com/try/try.php?filename=tryhtml5_iframe_sandbox

1

http://www.runoob.com/tags/att-iframe-sandbox.html

HTML <iframe> sandbox 属性

HTML <iframe> 标签

实例

带有额外限制的 <iframe>:

<iframe src="demo_iframe_sandbox.htm" sandbox=""></iframe>

尝试一下 »

(更多实例见页面底部)


浏览器支持

Internet Explorer 10、Firefox、Chrome 和 Safari 支持 sandbox 属性。

注意:Opera 和 Internet Explorer 9 及之前的版本不支持 sandbox 属性。


定义和用法

如果指定了空字符串(sandbox=""),该属性对呈现在iframe框架中的内容启用一些额外的限制条件。

sandbox 属性的值既可以是一个空字符串(将会启用所有的限制),也可以是用空格分隔的一系列指定的字符串。

HTML 5通过sandbox属性提升iFrame的安全性。sandbox属性可以防止不信任的Web页面执行某些操作。

HTML 5规范的编辑Ian Hickson谈到了sandbox的好处,它可以防止如下操作:

  • 访问父页面的DOM(从技术角度来说,这是因为相对于父页面iframe已经成为不同的源了)
  • 执行脚本
  • 通过脚本嵌入自己的表单或是操纵表单
  • 对cookie、本地存储或本地SQL数据库的读写

HTML 4.01 与 HTML5之间的差异

sandbox 属性是 HTML5 中的新属性。


语法

<iframe sandbox="value">

属性值

描述
"" 启用所有限制条件
allow-same-origin 允许将内容作为普通来源对待。如果未使用该关键字,嵌入的内容将被视为一个独立的源。
allow-top-navigation 嵌入的页面的上下文可以导航(加载)内容到顶级的浏览上下文环境(browsing context)。如果未使用该关键字,这个操作将不可用。
allow-forms 允许表单提交。
allow-scripts 允许脚本执行。

更多实例

一个允许表单提交的 <iframe> sandbox
启用一系列额外限制,但允许表单提交。

一个允许脚本和访问服务器内容的 <iframe> sandbox
启用一系列额外限制,但允许脚本和访问服务器内容。

# iframe & HTTPS & CORS

https://iframe.xgqfrms.xyz/eapp/index.html#blog.sina.cn

HTML5 iframe sandbox javascript getTime的更多相关文章

  1. Bring Your Charts to Life with HTML5 Canvas and JavaScript

    Bring Your Charts to Life with HTML5 Canvas and JavaScript Bring Your Charts to Life with HTML5 Canv ...

  2. html5 iframe

    html5 iframe元素:用于在网页中嵌入另一个页面,或嵌入视频 可替换元素 显示内容取决于元素属性 css不能完全控制其中样式 通常是行内块盒子 <a href="" ...

  3. iframe & sandbox & 微前端

    iframe & sandbox & 微前端 沙箱,容器,隔离 sandbox demo svg progress bar https://stackoverflow.com/ques ...

  4. HTML5 Audio and JavaScript Control

    IE8 以下无效 <!DOCTYPE html> <html> <head> <meta content="text/html; charset=u ...

  5. 利用HTML5 Canvas和Javascript实现的蚁群算法求解TSP问题演示

    HTML5提供了Canvas对象,为画图应用提供了便利. Javascript可执行于浏览器中, 而不须要安装特定的编译器: 基于HTML5和Javascript语言, 可随时编写应用, 为算法測试带 ...

  6. ie6 iframe src="javascript:" 报安全警报问题

    <iframe id="shuaka_iframe" class="embed-page-iframe" data-src="https://w ...

  7. HTML5,CSS3 与 Javascript 制作视频播放器

    早一段时间,有一直研究 HTML5 和 CSS3 ,自己也做了不少 Demo ,只是 HTML5 Video 和 Audio 由于自己平时比较喜欢留意不同的播放器,因此特别想做一个自己喜欢的设计,考虑 ...

  8. HTML5 + AJAX ( 原生JavaScript ) 异步多文件上传

    这是在上篇 HTML5 + AJAX ( jQuery版本 ) 文件上传带进度条 的修改版本.后台代码不变就可以接着使用,但是脚本不再使用jQuery了,改为原生的 JavaScript 代码,所以我 ...

  9. 【HTML5】使用 JavaScript 来获取电池状态(Battery Status API)

    HTML5 规范已经越来越成熟,可以让你访问更多来自设备的信息,其中包括最近提交的 "Battery Status API".如其名称所示,该 API 允许你通过 JavaScri ...

随机推荐

  1. for循环删除列表中元素遇到的漏删的问题(python)

    问题描述:python中通过for循环来删除列表中的两个相邻的元素,存在漏删的问题 比如说下面的例子,准备删掉2和3,但是结果是2删掉了,3没删掉 是因为把2删掉后3的下标就变成了1,但是原本下标为1 ...

  2. 推荐软件7 taskbar numberer,结果get了WIN相关的快捷键

    作为键盘控,Win+数字直达任务栏上的应用已经让我欣喜.接下来我的问题就是每次要数数字才能确定是哪个数字,期间我尝试过按常用顺序进行排序并尝试记住它们.直到我想也许应该有个软件可以在任务栏图标处贴上一 ...

  3. PAT (Basic Level) Practice 1032 挖掘机技术哪家强

    个人练习 为了用事实说明挖掘机技术到底哪家强,PAT 组织了一场挖掘机技能大赛.现请你根据比赛结果统计出技术最强的那个学校. 输入格式: 输入在第 1 行给出不超过 10​^5的正整数 N,即参赛人数 ...

  4. JZ2440开发板:UART(串口)使用(学习笔记)

    查看UART在硬件上的信息,阅读JZ2440原理图可以看到: JZ2440开发板的UART0是可以跟USB相接的,用于打印调试,UART1,UART2两个串口用来外接模块.所以本文仅对UART0进行操 ...

  5. 汇编指令lodsb和stosb、lodsd和stosd

    lodsb指令,将esi指向的地址处的数据取出来赋给AL寄存器,esi=esi+1: lodsw指令则取得是一个字. lodsd指令,取得是双字节,即mov eax,[esi],esi=esi+4: ...

  6. jxls-1.x导出excel入门——基本操作

    请注意,一下内容均基于1.x版本,2.x版本将另开随笔记录 一.概述  JXLS是基于Jakarta POI API的Excel报表生成工具,可以生成精美的Excel格式报表.它采用标签的方式,类似J ...

  7. 【机器学习笔记】循环神经网络RNN

    1. 从一个栗子开始 - Slot Filling 比如在一个订票系统上,我们的输入 "Arrive Taipei on November 2nd" 这样一个序列,我们设置几个槽位 ...

  8. 3551: [ONTAK2010]Peaks加强版

    3551: [ONTAK2010]Peaks加强版 https://www.lydsy.com/JudgeOnline/problem.php?id=3551 分析: kruskal重构树 +  倍增 ...

  9. Jmeter登录接口返回 status415

    1.现象:在查看结果树中看到: Request Headers:Connection: keep-aliveContent-Type: application/x-www-form-urlencode ...

  10. ntp-redhat 同步时间配置

    1. 选作一个机器作为ntp 服务端,例如 ip 为192.168.0.1 1)安装 ntp服务 yum install ntp 2) 修改ntp.conf 文件 vi /etc/ntp.conf 注 ...