整理vue中使⽤iframe
基本格式
<iframe src="demo.html" height="300" width="500" name="demo" scrolling="auto" sandbox="allow-same-origin allow-scripts"></iframe>基本属性：
src iframe页⾯地址，有同域跨域之分
schooluniformheight iframe⾼度
width iframe宽度
name iframe命名，可通过window.frames[xxx]被调⽤
scrolling iframe滚动模式
sandbox html5新特性，⽤于限制iframe的功能
1. script脚本不能执⾏
2. 不能发送ajax请求
3. 不能使⽤本地存储，即localStorage,cookie等
抄送英语4. 不能创建新的弹窗和window
5. 不能发送表单
6. 不能加载额外插件⽐如flash等
| 配置 | 效果 |
| -------------------- | --------------------------------------------- |
| allow-forms | 允许进⾏提交表单 |
| allow-scripts | 运⾏执⾏脚本 |
| allow-same-origin | 允许同域请求,⽐如ajax,storage |
| allow-top-navigation | 允许iframe能够主导p进⾏页⾯跳转 |
| allow-popups | 允许iframe中弹出新窗⼝,⽐如,window.open,target="_blank" |长沙英语培训
| allow-pointer-lock | 在iframe中可以锁定⿏标，主要和⿏标锁定有关 |
factor
sandbox="allow-forms allow-same-origin allow-scripts"
使⽤iframe的正确姿势
let iframe = ElementById('demo');
let iwindow = tWindow; // 获取iframe的window对象
let idoc = tDocument; // 获取iframe的document对象
也可以通过 window.frames[iframeName] 来调⽤iframe
实际是这么获取
let iframe = ElementById('iframe');
iframe.attributes[1].tWindow;
iframe使⽤⽗级内容的正确姿势
expensive的同义词
chokeanyway什么意思
通过
window.lf，
window.parent，
情人节快乐英语
这三个属性分别获取⾃⾝window对象，⽗级window对象，顶级window对象
iframe1.lf === iframe1
iframe1.parent === iframe2
iframe2.parent === window
英语词库iframe ⽅法
滚动
erect
window.frames.scrollTo(x, y);
获取节点距顶部的距离
let node = ElementById(`node${this.current}`);
let offtTop = node.attributes[1].ownerElement.offtTop; // 这⾥ attributes 下标不固定得具体查看节点信息
