谷歌火狐和ie是有区别的
谷歌需要服务器,为了更安全 获取内容的时候, 正常渲染没问题
获取内容
var oIframe = document.getElementById('iframe');

oIframe.contentWindow 获取到所有的内容节点
注:谷歌下会报错 需要服务器下

oIframe.contentWindow.document.getElementById('div') 获取到页面下的某个id为div的元素
oIframe.contentWindow.document.getElementById('div').style.color='red' 改变他的字体颜色
所有浏览器都支持

操控document
oIframe.contentDocument.getElementById('div') 可以直接获取到document下的元素
注:ie6,7 不支持 。 所以在ie6,7 下需要获取window再操纵Document

另一种情况 就是 三成嵌套
利用最里面的iframe 控制最外层的父级 window.top
例如:
iframe.html
<body>
<iframe src="iframe1.html"></iframe>
</body>

iframe3.html
<body>
aa
<iframe src="iframe.html"></iframe>
</body>

iframe1.html
<body>
<input type="button" value="变红" id="btn" />
</body>

//点击按钮使iframe3的aa变红
var oBtn = document.getElementById('btn');
oBtn.onclick=function(){
window.top.getElementsByTagName('body')[0].style.color="red";
};

onload 事件 oIframe 有 onload 事件
oIframe.onload=function(){ alert(1) } //chrome,ff
oIframe.attachEvent('onload',function(){ alert(1) }) //ie 现在ie不需要事件绑定就可

防止自己的网站被别人利用 被钓鱼 —— 做一下处理
在自己的网站加js
if(window!=window.top){
window.top.location.href = window.location.href;
}
这样在连接自己网站的时候会直接跳到自己的网页

实例:

window.onload=function(){
var oIframe = document.createElement('iframe');
oIframe.src = 'iframe7.html';
document.getElementsByTagName('body')[0].appendChild(oIframe);
function changeHeight(){
setTimeout(function(){
oIframe.height = oIframe.contentWindow.document.body.offsetHeight;
},500);
}

//根据连接文件的高度动态改变iframe的高度
var oBtn = document.getElementById('btn');
oBtn.onclick =function(){
oIframe.src = 'iframe8.html';
changeHeight();
}
var oBtn1 = document.getElementById('btn1');
oBtn1.onclick =function(){
oIframe.src = 'iframe7.html';
changeHeight();
}
changeHeight();
}

iframe详细的使用的更多相关文章

  1. iframe详细用法

    <iframe>是框架的一种形式,也比较常用到. 例子1.<iframe width=420 height=330 frameborder=0 scrolling=auto src= ...

  2. Iframe的应用以及父窗口和子窗口的相互访问

    点评:Iframe和FRAME的区别,方便大家以后在使用过程中根据实际需要取舍.- function getParentIFrameDocument(aID) { var rv = null; // ...

  3. 4款基于html5 canvas充满想象力的重力特效

    今天给大家分享4个物理和重力实验,用来展示 html canvas 的强大.几年前,所有这些实验都必须使用 Java 或 Flash 才能做.在下面这些惊人的例子中,就个人而言,我比较喜欢仿真布料的那 ...

  4. html Frame、Iframe、Frameset 的区别 详细出处参考:http://www.jb51.net/web/22785.html

    10.4.1 Frameset与Frame的区别首先讲解Frameset与Frame之间的区别. 用来划分框架,每一个框架由标记.必须在之内使用,代码如下: 在上面的例子当中,把页面分为左右两个部分, ...

  5. Iframe 用法的详细讲解

    1转自:https://blog.csdn.net/judyge/article/details/51786064 zIframe 用法的详细讲解 把iframe解释成“浏览器中的浏览器“很是恰当 & ...

  6. 使用iframe的好处与坏处详细比拼

    一.使用iframe的坏处 1.搜索引擎的蜘蛛不会识别在iframe中被调用的图片.文本.url等内容的,因为该内容不属于该页面,只是访问的时候被临时的调用,而且在SEO建议中也有提到:"f ...

  7. 解析Jquery取得iframe中元素的几种方法

    iframe在复合文档中经常用到,利用jquery操作iframe可以大幅提高效率,这里收集一些基本操作,需要的朋友可以参考下   DOM方法:父窗口操作IFRAME:window.frames[&q ...

  8. virut详细分析

    Virut分析 0x00.综合描述 virut样本的执行过程大体可以分为六步:第一步,解密数据代码,并调用解密后的代码:第二步,通过互斥体判断系统环境,解密病毒代码并执行:第三步,创建内存映射文件,执 ...

  9. 两种文件上传的实现-Ajax和form+iframe

    前言 话说现在很多很多项目需要用到文件上传,自从有了HTML5之后,上传就变的超级简单了.HTML5支持多图片上传,而且支持ajax上传,而且支持上传之前图片的预览,而且支持图片拖拽上传,而且还是纯粹 ...

随机推荐

  1. Intent传递数据的方法

    一.传递List 1.传递List<String>的方法 ArrayList<String> info = new ArrayList<String>(); inf ...

  2. Contains Duplicate III 下标范围<=k 值范围<=t

    set妙用 1.维护一个大小最大位k的set set中数据是有顺序的 2.每次新加一个数据,只需要比较该数据加入 有没有带来变化 3.找到 >= 新数据-t的数据对应的迭代器 pos 4.如果找 ...

  3. 压力测试工具JMeter入门教程

    1.Jmeter 概要描叙 jmeter 是一款专门用于功能测试和压力测试的轻量级测试开发平台.多数情况下是用作压力测试,该测试工具在阿里巴巴有着广泛的使用,估计是不要钱吧,哈哈,功能上来说,整个平台 ...

  4. ftp相关资料

    一.ftp状态码 110  重新启动标记应答.在这种情况下文本是确定的,它必须是:MARK   yyyy=mmmm,其中yyyy是用户进程数据流标记,mmmm是服务器标记.      120     ...

  5. location对象说明

    在浏览器的console层输入 location 即可输出该对象的相关信息 location.protocol   协议类型  http/https location.hostname 主机名 loc ...

  6. linux解压/压缩文件

    1.*.tar 用 tar –xvf 解压  2.*.gz 用 gzip -d或者gunzip 解压  3.*.tar.gz和*.tgz 用 tar –xzf 解压  4.*.bz2 用 bzip2 ...

  7. stm32 cubemx hal 工程中 微秒延迟 delay_us

    参考的正点原子的代码 测试平台 stm32f429i-disco 配了一个gpio 时钟 gpio /* USER CODE BEGIN 0 */ typedef uint8_t u8; typede ...

  8. JSON入门教程

    尽管有许多宣传关于 XML 如何拥有跨平台,跨语言的优势,然而,除非应用于 Web Services,否则,在普通的 Web 应用中,开发者经常为 XML 的解析伤透了脑筋,无论是服务器端生成或处理 ...

  9. 用CSS制作伪标签云

    performance testing stress testing conformance testing acceptane testing smoke testing regression te ...

  10. 概率论与数理统计讲课PPT和往年期末试卷

    讲课PPT 第17课:数理统计的基本概念 注 : 我会陆续把讲课PPT放上去,大家可以下载. 往年试卷及解答 往年期末试卷及解答 注 : 供同学们参考以备考.