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. [ An Ac a Day ^_^ ] Codeforces Round #368 Div. 2 A B C

    昨天才回学校 刚好赶上CF所以就没写博客 不过还是水题了…… A. 比赛的时候被hack了 仔细读题才知道grey也算是黑白的 英语不好好伤心…… #include<stdio.h> #i ...

  2. 一些css3的特效 javascript的window对象 定时器 延时器等ing...

    风车转动代码 <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> < ...

  3. ThinkPHP框架基础

    ThinkPHP 一.php框架基础介绍 真实项目开发步骤: 多人同时开发项目,协作开发项目.分工合理.效率有提高(代码风格不一样.分工不好) 测试阶段 上线运行 对项目进行维护.修改.升级(单个人维 ...

  4. OC和JS的交互---JavaScriptCore

    JavaScriptCore的简单介绍 JavaScriptCore是iOS7提供的原生框架,可以让Objective-C和JavaScript提供简单直接的交互. JavaScriptCore的使用 ...

  5. 浅谈hbase表中数据导出导入（也就是备份）

    转自:http://blog.chinaunix.net/xmlrpc.php?r=blog/article&uid=23916356&id=3321832 最近因为生产环境hbase ...

  6. 关于C#文件复制（递归）

    using System;using System.Collections.Generic;using System.ComponentModel;using System.Data;using Sy ...

  7. spark java 代码example

    https://github.com/apache/spark/tree/master/examples/src/main/java/org/apache/spark/examples

  8. linux中的 tar命令的 -C 参数,以及其它一些参数（转）

    linux中的 tar命令的 -C 参数,以及其它一些参数 复制源:http://www.cnblogs.com/li-hao/archive/2011/10/03/2198480.htmltar命令 ...

  9. how computer boot up?

    The power button activates the power supply in the PC, sending power to the motherboard and other co ...

  10. CentOS 7 rsync

    CentOS 7 rsync 1)软件简介 Rsync 是一个远程数据同步工具,可通过 LAN/WAN 快速同步多台主机间的文件.Rsync 本来是用以取代rcp 的一个工具,它当前由 Rsync.s ...