谷歌火狐和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. Sublime一键预览

    //chrome{ "keys": [ "f12" ], "command": "side_bar_files_open_with ...

  2. ODBC简介

    加载驱动 1 oracle Class.forName("oracle.JDBC.driver.OracleDriver") 2 DB2 Class.forName("c ...

  3. CSS零基础学习笔记.

    酸菜记 之 CSS的零基础. 这篇是我自己从零基础学习CSS的笔记加理解总结归纳的,如有不对的地方,请留言指教, 学前了解: CSS中字母是不分大小写的; CSS文件可以使用在各种程序文件中(如:PH ...

  4. 通过Ajax异步提交的方法实现从数据库获取省份和城市信息实现二级联动(xml方法)

    之前有写过是从JavaScript数组里获取省市信息来实现二级联动,但是似乎有很多需求是要从数据库里获取信息,所以就需要根据异步提交,局部刷新的思想来实现来提高用户交互问题 第一种方法是xml方法 1 ...

  5. 后端学 Angular 2 —— 组件间通信

    1. 父组件向子组件传递信息 使用@Input 子组件的属性用 @Input 进行修饰,在父组件的模板中绑定变量 例子: import { Component, OnInit, Input } fro ...

  6. Apache2.4权限配置(原创帖-转载请注明出处)

    ==================说在前面的话================= 1:这次实验使用的php项目是Discuz,Discuz的安装请参照:http://www.cnblogs.com/ ...

  7. Life is short

    相信不少码农曾看过类似“life is short, use Python”等之类略带调侃意味的小段子(譬如我),而其也并非不无道理.每门编程语言都是合理的存在,都有它们的优点,及缺陷. 码农们也大多 ...

  8. WebForm session,cookies

    session : Session:在计算机中,尤其是在网络应用中,称为"会话控制".Session 对象存储特定用户会话所需的属性及配置信息.这样,当用户在应用程序的 Web页之 ...

  9. 【前端】JavaScript获取指定范围内的随机整数

    function getRandomIntNumber(min, max) { var span = max - min + 1; var result = Math.floor(Math.rando ...

  10. HTTP 错误 403.14 - Forbidden Web 服务器被配置为不列出此目录的内容

    今天把一个.NET的网站部署到IIS上打开网页的时候出现了这个错误,刚开始以为是没有配置默认页,但是直接打开固定的页面地址也不行. 于是怀疑是.NET版本的问题,但是看了一下程序的目标框架是4.0没错 ...