WEB前端线上系统课(20k+标准)-大神coderwhy全程直播授课
iframe基本内涵通常我们使用iframe直接直接在页面嵌套iframe标签指定src就可以了。
必看！如何download课程iframesrc="demo_iframe_sandbox.htm"/iframe
但是，有追求的我们，并不是想要这么low的iframe.我们来看看在iframe中还可以设置些什么属性
iframe常用属性:1.frameborder:是否显示边框，1(yes),0(no)2.height:框架作为一个普通元素的高度，建议在使用css设置。.width:框架作为一个普通元素的宽度，建议使用css设置。4.name:框架的名称，window.frames[name]时专用的属性。5.scrolling:框架的是否滚动。yes,no,auto。6.src：内框架的地址，可以使页面地址，也可以是图片的地址。7.srcdoc,用来替代原来HTMLbody里面的内容。但是IE不支持,不过也没什么卵用8.sandbox:对iframe进行一些列限制，IE10+支持
上面一些tag，会在下文进行穿插说明，单个不好说。我们通常使用iframe最基本的特性，就是能自由操作iframe和父框架的内容(DOM).但前提条件是同域.如果跨域顶多只能实现页面跳转window.location.href.那什么是同域/什么是跨域呢?就是判断你的url首部是否一样，下面会有讲解，这里只是提及。同域不同域的问题:
A:iframeid="mainIframe"name="mainIframe"src="/main.html"frameborder="0"scrolling="auto"/iframeB:iframeid="mainIframe"name="mainIframe"src=" top.location.href=window.location.href;}
当然，如果你网页不同域名的话，上述就会报错。所以，这里可以使用try...catch...进行错误捕获。如果发生错误，则说明不同域，表示你的页面被盗用了。可能有些浏览器这样写是不会报错，所以需要降级处理。这时候再进行跳转即可.
try{ top.location.hostname;//检测是否出错 //如果没有出错，则降级处理 if(top.location.hostname!=window.location.hostname){ top.location.href=window.location.href; }}catch(e){ top.location.href=window.location.href;}
这只是浏览器端，对iframe页面的权限做出相关的设置。我们还可以在服务器上，对使用iframe的权限进行设置.
X-Frame-OptionsX-Frame-Options是一个相应头，主要是描述服务器的网页资源的iframe权限。目前的支持度是IE8+(已经很好了啊喂)有个选项:
DENY：当前页面不能被嵌套iframe里，即便是在相同域名的页面中嵌套也不允许,也不允许网页中有嵌套iframeSAMEORIGIN：iframe页面的地址只能为同源域名下的页面ALLOW-FROM：可以在指定的originurl的iframe中加载
X-Frame-Options:DENY
拒绝任何iframe的嵌套请求
X-Frame-Options:SAMEORIGIN
只允许同源请求，例如网页为foo. top.location.href=window.location.href;}//等价于X-Frame-Options:SAMEORIGIN
该属性是对页面的iframe进行一个主要限制，不过，涉及iframe的header可不止这一个，另外还有一个ContentSecurityPolicy,他同样也可以对iframe进行限制，而且，他应该是以后网页安全防护的主流。
CSP之页面防护和X-Frames-Options一样，都需要在服务器端设置好相关的Header.CSP的作用，真的是太大了，他能够极大的防止你的页面被
联系电话：