js操作iframe

contentWindow    
在服务器环境下测试
contentDocument
二种方法的区别
子级iframe修改父级元素内容
window.parent
window.top与window.parent的区别

window.top:是当前文件最顶端的那个文件,window.parent:是当前文件上面的文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head> <body>
<div style="width:200px; height:200px; background:red;"></div>
</body>
</html>

上面是iframe4

下面是iframe5

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
</head> <body>
<div style="width:200px; height:400px; background:green;"></div>
</body>
</html>

  父文件

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script>
window.onload = function(){
var aInput = document.getElementsByTagName('input');
var oIframe = document.getElementById('iframe1'); function changeHeight(){ setTimeout(function(){
oIframe.height = oIframe.contentWindow.document.body.offsetHeight;
},100);//防止转向文件与changeHeight函数同时运行 }
changeHeight(); aInput[0].onclick = function(){
oIframe.src = 'iframe4.html';
changeHeight();
}; aInput[1].onclick = function(){
oIframe.src = 'iframe5.html';
changeHeight();
};
};
</script>
</head> <body>
<input type="button" value="切换1" />
<input type="button" value="切换2" />
<iframe id="iframe1" src="iframe4.html" scrolling="no"></iframe>
</body>
</html>

iframe2016/4/12的更多相关文章

  1. python 各模块

    01 关于本书 02 代码约定 03 关于例子 04 如何联系我们 1 核心模块 11 介绍 111 内建函数和异常 112 操作系统接口模块 113 类型支持模块 114 正则表达式 115 语言支 ...

  2. Python Standard Library

    Python Standard Library "We'd like to pretend that 'Fredrik' is a role, but even hundreds of vo ...

  3. 在mybatis中写sql语句的一些体会

    本文会使用一个案例,就mybatis的一些基础语法进行讲解.案例中使用到的数据库表和对象如下: article表:这个表存放的是文章的基础信息 -- ------------------------- ...

  4. AndroidStudio — Error:Failed to resolve: junit:junit:4.12错误解决

    原博客:http://blog.csdn.net/u013443865/article/details/50243193 最近使用AndroidStudio出现以下问题: 解决:打开app下的buil ...

  5. 读过MBA的CEO更自私?《哈佛商业评论》2016年第12期。4星

    老牌管理杂志.每期都值得精度.本期我还是给4星. 以下是本书中的一些内容的摘抄: 1:他们发现在Airbnb上,如果客人姓名听起来像黑人,那么比名字像白人的客人的接受率会低16%.#45 2:对立组织 ...

  6. 12个小技巧,让你高效使用Eclipse

    集成开发环境(IDE)让应用开发更加容易.它们强调语法,让你知道是否你存在编译错误,在众多的其他事情中允许你单步调试代码.像所有的IDE一 样,Eclipse也有快捷键和小工具,这些会让您感觉轻松许多 ...

  7. 第12章 Linux系统管理

    1. 进程管理 1.1 进程查看 (1)进程简介 进程是正在执行的一个程序或命令(如ls命令也是一个进程),每个进程都是一个运行的实体,都有自己的地址空间,并占用一定的系统资源. (2)进程管理的作用 ...

  8. Jexus Web Server 完全傻瓜化图文配置教程(基于Ubuntu 12.04.3 64位)[内含Hyper-v 2012虚拟机镜像下载地址]

    1. 前言 近日有感许多新朋友想尝试使用Jexus,不过绝大多数都困惑徘徊在Linux如何安装啊,如何编译Mono啊,如何配置Jexus啊...等等基础问题,于是昨日向宇内流云兄提议,不如搞几个配置好 ...

  9. CSharpGL(12)用T4模板生成CSSL及其renderer代码

    CSharpGL(12)用T4模板生成CSSL及其renderer代码 2016-08-13 由于CSharpGL一直在更新,现在这个教程已经不适用最新的代码了.CSharpGL源码中包含10多个独立 ...

随机推荐

  1. P2P直连?经服务器中转?

    当同一个系统的两个客户端A.B相互发送消息给对方时,如果它们之间存在P2P通道,那么消息传送的路径就有两种:直接经P2P通道传送.或者经服务器中转.如下图所示: 通常就一般应用而言,如果P2P通道能够 ...

  2. [ An Ac a Day ^_^ ] UVALive 7270 Osu! Master

    2015icpc北京区域赛的签到题 还是很签到的 一次就过了 题意呢 就是统计B C后最长上升序列还有S的个数 当然B C要被S分割开…… /* *************************** ...

  3. 封装一个Ajax工具函数

    /*封装一个ajax工具函数*/ window.$ = {}; /*通过$定义一个ajax函数*/ /* * 1. type   string   请求的方式  默认是get * 2. url     ...

  4. android 按钮Button单击背景切换

    res/drawable/btn_selected.xml <?xml version="1.0" encoding="utf-8"?> <s ...

  5. 《Windows驱动开发技术详解》之驱动程序的基本结构

    驱动对象 每个驱动程序会有唯一的驱动对象与之对应,并且这个驱动对象是在驱动加载的时候被内核中的对象管理程序所创建的.驱动对象用DRIVER_OBJECT数据结构表示,它作为驱动的一个实例被内核加载,并 ...

  6. QC使用中问题点汇总

    QC 使用中问题点汇总,包括以下四个方面: 1.不兼容IE7,IE8的问题(服务器端设置) 2.无法在Win 7下正常下载页面(客户端设置) 3.在QC中填写中文内容后无法正常提交到数据库(客户端设置 ...

  7. <context:annotation-config/>

    转自:Spring <context:annotation-config/> 解说 在基于主机方式配置Spring的配置文件中,你可能会见到<context:annotation-c ...

  8. 十三章:使用WEB字体

    1.WEB字体可以使用一系列文件类型,下面介绍三种字体类型: (1)内嵌OpenType (2)TrueType和OpenType台式机使用的标准字体文件类型 (3)WEB开放字体格式. 2.构造子集 ...

  9. VMWare桥接、NAT和only-host三种模式

    如果你想利用VMWare安装虚拟机,或想创建一个与网内其他机器相隔离的虚拟系统,进行特殊的调试工作.此时,对虚拟系统网络连接模式的选择就非常重要了.如果你选择的工作模式不正确,就无法实现上述目的,也就 ...

  10. hdu_3001_Travelling(状压DP)

    题目连接:http://acm.hdu.edu.cn/showproblem.php?pid=3001 题意:给你N个点,M条边,每个点最多走两次,问走完N个点最短的路程为多少. 题解:注意这题有重边 ...