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. LeetCode OJ 53. Maximum Subarray

    Find the contiguous subarray within an array (containing at least one number) which has the largest ...

  2. CodeForces 701C They Are Everywhere 尺取法

    简单的尺取法…… 先找到右边界 然后在已经有了所有字母后减小左边界…… 不断优化最短区间就好了~ #include<stdio.h> #include<string.h> #d ...

  3. css3制作字体

    代码教程 HTML代码用H1吧,这样语义化好些,因为标题一般用h1-h6. <h1 class="vintage">美丽的中国语</h1> 纯CSS制作的复 ...

  4. intellij中javax包的导入

    新建intellij的maven web想项目的时候,出现的问题,import javax.servlet.http相关的包出错 好久不搭建也好久没用intellij了,都忘了,在这里笔记一下 再次吐 ...

  5. [原]创建三个输入文本框，当光标离开文本框的时候如果文本框为空，则将文本框背景色设置为红色，如果不为空则为白色。提示：焦点进入控件的事件是onfocus，焦点离开控件的事件是onblur

    window.onload = function () {             var txts = document.getElementsByTagName('input');         ...

  6. HDU 5806 NanoApe Loves Sequence Ⅱ

    将大于等于m的数改为1,其余的改为0.问题转变成了有多少个区间的区间和>=k.可以枚举起点,二分第一个终点 或者尺取法. #pragma comment(linker, "/STACK ...

  7. Windows进程间通信（下）

    六.动态数据交换(Dynamic Data Exchange) 动态数据交换(DDE)是使用共享内存在应用程序之间进行数据交换的一种进程间通信形式.应用程序可以使用DDE进行一次性数据传输,也可以当出 ...

  8. array_walk与array_map 的不同 array_filter

      array_walk 主要是要对数组内的每个值进行操作,操作结果影响原来的数组 array_map主要是对数组中的值进行操作后返回数组,以得到一个新数组 wallk 可以没有返回值 map要有,因 ...

  9. js第一天 点击按钮显示与隐藏

    <!DOCTYPE html><html> <head> <meta charset="utf-8" /> <title> ...

  10. lua学习

    在lua中,一切都是变量,除了关键字. 1.注释: 单行注释: 连续两个减号“--”表示注释的开始,一直延续到行末.相当于C语言中的“//” 多行注释:由“--[[”表示注释开始, “]]”表示注释结 ...