这里以图为例,在这里把frame之间的互相操作简单列为:1变量2方法3页面之间元素的互相获取。

A  首先从 父(frameABC)------->子(frameA,frameB,frameC)

a1 : 访问变量名name

假如在frameABC中操作那么可以:

window.frames("frameA").contentWindow.name

或者document.getElementById("frameA").contentWindow.name

或者jquery:window.$("#frameA")[0].contentWindow.name

a2:访问方法func

假如在frameABC中操作那么可以:

window.frames("frameA").contentWindow.func();

或者document.getElementById("frameA").contentWindow.func();

或者jquery:window.$("#frameA")[0].contentWindow.func();

a3:访问子页面元素:username

假如在frameABC中操作那么可以:

window.frames("frameA").contentWindow.document.getElementById("username");

或者document.getElementById("frameA").contentWindow.document.getElementById("username");

或者jquery:window.$("#frameA")[0].contentWindow.$("#username");

B 然后从子(frameA,frameB,frameC)------------>到父(frameABC)

b1:访问父页面变量name,假如在frameA中(子页面)操作那么可以:

window.parent.name;

b2:访问父页面方法func,假如在frameA中(子页面)操作那么可以:

window.parent.func();

b3:访问父页面元素username,假如在frameA中(子页面)操作那么可以:
          window.parent.$("#username")

或者:window.parent.document.getElementById("username");

------------------------------------------------------------------------------

总结:frame只是一个页面框架,要想操作子frame中的元素都需要首先进入到window或者contentWindow。从子页面访问父页面,需要计算好父子关系,分几层结构。

在网上看了其他帖子,谈到有关页面加载的问题。大概意思是在子frame页面还没加载出来就进行元素操作,会引起bug,有兴趣的可以在下面写写自己的见解。

语句1. window.parent.frames[1].location.reload(); 
语句2. window.parent.frames.bottom.location.reload(); 
语句3. window.parent.frames["bottom"].location.reload(); 
语句4. window.parent.frames.item(1).location.reload(); 
语句5. window.parent.frames.item('bottom').location.reload(); 
语句6. window.parent.bottom.location.reload(); 
语句7. window.parent['bottom'].location.reload(); 

js中frame的操作问题的更多相关文章

  1. js中的DOM操作汇总

    一.DOM创建 DOM节点(Node)通常对应于一个标签,一个文本,或者一个HTML属性.DOM节点有一个nodeType属性用来表示当前元素的类型,它是一个整数: Element,元素 Attrib ...

  2. js中的json操作

    js中的json操作 JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式,采用完全独立于语言的文本格式,是理想的数据交换格式.同时,JSON是 JavaScr ...

  3. js中Frame框架的属性获取(1)

    js中window和document对象及如何操作iframe 一. window对象 . 什么是window对象? Window对象表示浏览器打开的窗口.如果文档包含iframe或者是frame标签 ...

  4. JS中获取和操作iframe

    一.需求与遇到的问题 在网站的后台管理中使用了iframe框架布局,包括顶部菜单.左侧导航和主页面.需求是:点击主页面上的一个按钮,在顶部菜单栏的右侧显示“退出”链接,点击可退出系统. 我的思路是:在 ...

  5. js中常用的操作

    1.js中常用的数组操作 2.js中常用的字符串操作 3.js中常用的时间日期操作 4.定时器

  6. JS中的DOM操作和事件

    [DOM树节点] DOM节点分为三大类: 元素节点. 属性节点. 文本节点: 文本节点.属性节点属于元素节点的子节点.操作时,均需要先取到元素节点,再操作子节点:可以使用getElement系列方法, ...

  7. 1 js中常用的操作

    总结一些前端js常用的操作 常用日期操作:前端开发常用 JS 方法 js中array.list.map的遍历:js遍历集合(Array,Map,Set) js中对象的定义:js创建自定义对象的几种方式 ...

  8. 当Thymeleaf遇到向js中传值的操作

    在使用Thymeleaf的时候.关于一些点击操作非常头疼.往往需要向JS里面传递各种东西. 然而,在用Thymeleaf的时候.js操作需要拼接语句.但是又不好拼接. 关于一些操作,一般也是在表格中. ...

  9. 用位运算替代js中的常见操作

    一.补码 所谓补码就是所有位取反: 例如3的二进制表示是:00000011,那么3的补码就是11111100: 对于-3的二进制表示就是3的补码+1:11111101: 所以二进制的负数就是该数的补码 ...

随机推荐

  1. MVC Razor标签

    1. RenderBody在Razor引擎中没有了“母版页”,取而代之的是叫做“布局”的页面(_Layout.cshtml)放在了共享视图文件夹中.在这个页面中,会看到标签里有这样一条语句:@Rend ...

  2. 【原创】纯OO:从设计到编码写一个FlappyBird (四)

    第三部分请点这里 这里来实现Obstacle类.其实flappybird的本质就是小鸟原地掉,然后几根柱子在走.这也是在Game类里,用obs.move()来实现游戏逻辑的原因. 我们首先必须确定几个 ...

  3. 【原创】ZOJ_1649 Rescue 解题报告

    Rescue Time Limit: 2 Seconds      Memory Limit: 65536 KB Angel was caught by the MOLIGPY! He was put ...

  4. 打开 chm 帮助文件显示空白及解决方法

    有个很奇葩的解决方法:把 chm 文件用压缩软件压缩,然后用压缩软打开此压缩包,直接双击压缩包里面的 chm 文件 这虽然解决了问题,但是这不科学…… 分析:直接打开压缩包里面的文件,压缩包的文件是临 ...

  5. PhoneGap 开发与应用 上传 App Store 在

    几个简单的归纳过程,前提是你有一个开发者账户,而且必须有Mac 虚拟机或真机.尽管WIndows 也可以上载证书.但最终也必须用于上传应用程序 Xcode 要么  Application Loader ...

  6. ServiceStack.Hello——跨平台.net REST api服务搭建

    ServiceStack.Hello--跨平台.net REST api服务搭建 自己创建: https://github.com/ServiceStack/ServiceStack/wiki/Cre ...

  7. PowerDesigner创建物理模型

    原文:PowerDesigner创建物理模型 Using PowerDesigner Create PDM 1.打开PowerDesigner 按Ctrl+N 创建物理模型 2.创建后修改名称,并在工 ...

  8. Android新建项目后src下没有自动生成文件

    最近开始学Android了,按照教材新建了一个项目,发现src下没有自动生成文件,怎么回事呢? 出现这种可能的原因很可能是ADT与SDK版本不同,造成不兼容. 在ADT(或者eclipse)中的hel ...

  9. akka.net与微软分布式框架Orleans

    微软分布式框架Orleans开源了 开源地址: https://github.com/dotnet/orleans 昨天编译了一下,这个最新的Orleans安装程序(用github源码编译的) 下载地 ...

  10. TestNg显示器(一个)-----监听器,类型和配置使用---另外META-INF详细解释

    原创文章,版权所有所有.转载,归因:http://blog.csdn.net/wanghantong/article/details/40404939 TestNg提供了听众和拦截多种接口开发我们自己 ...