js中frame的操作问题

这里以图为例,在这里把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,有兴趣的可以在下面写写自己的见解。

时间: 2024-10-09 02:13:46

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

js中的二进制操作相关类型和方法

Blob数据对象 MDN官方解释Blob对象:一个Blob对象就是一个包含有只读原始数据的类文件对象.Blob对象中的数据并不一定得是JavaScript中的原生形式.File接口基于Blob, 继承了Blob的功能,并且扩展支持了用户计算机上的本地文件. 创建Blob对象的方法有几种,可以调用Blob构造函数,还可以使用一个已有Blob对象上的slice()方法切出另一个Blob对象,还可以调用canvas对象上的toBlob方法. 实际上,Blob是计算机通用术语之一,全称写作:BLOB(b

JS中获取和操作iframe

一.需求与遇到的问题 在网站的后台管理中使用了iframe框架布局,包括顶部菜单.左侧导航和主页面.需求是:点击主页面上的一个按钮,在顶部菜单栏的右侧显示“退出”链接,点击可退出系统. 我的思路是:在顶部的菜单页面放一个不可见的“退出”链接,当用户点击位于iframe中的主页面(mainPage.htm)中的按钮时,在顶部菜单页面的右侧显示“退出”. 我现在遇到的问题是:如何在页面的一个iframe子页面(mainPage.htm)中获取并且操作其它iframe子页面(比如topPage.htm

JS中的DOM操作和事件

[DOM树节点] DOM节点分为三大类: 元素节点. 属性节点. 文本节点: 文本节点.属性节点属于元素节点的子节点.操作时,均需要先取到元素节点,再操作子节点: 可以使用getElement系列方法,取到元素节点. [查看元素节点] 1.getElementById:通过id取到唯一节点.如果ID重名,只能取到第一个. getElementsByName(): 通过name属性   getElementsByTagName(): 通过标签名   getElementsByClassName()

JS 中的二进制操作简介

from 作者:刘骥(@刘骥-JimLiu)网址:http://jimliu.net/2015/09/26/a-brief-look-at-binary-ops-in-js/ 写这篇博客的起源是在div.io上的一篇文章<你所不知道的JavaScript数组>by 小胡子哥下的评论中的讨论. 因为随着XHR2和现代浏览器的普及,在浏览器当中处理二进制不再向过去那样无所适从,随着Canvas/WebGL等新技术逐渐开始进入大众视野,也会用到一些字节数组或者16位.8位整数等东西.在node.js

js中的DOM操作(一)——查看及设置节点

一.前言 DOM 是 W3C(World Wide Web Consortium)标准.同时也 定义了访问诸如 XML 和 HTML 文档的标准: DOM是一个使程序和脚本有能力动态地访问和更新文档的内容.结构以及样式的平台和语言中立的接口. 在HTML和JavaScript的学习中,DOM操作可谓时重中之重.今天,小编就领着大家来看看DOM操作是个什么样子!! 二.DOM节点  DOM节点分为三大类:元素节点.属性节点.文本节点: 而我们心心念念想知道的DOM树就长酱紫!          

js中常见的操作

//第一篇博文,希望大家多多支持   /***** BasePage.js 公共的 脚本文件  部分方法需引用jquery库 *****/ //#region 日期操作  //字符串转化为时间.function stringtoTime(date1) {    var dt = new Date(Date.parse(date1.replace(/-/g, "/")));    return dt;}   // 使用 var date1 =  "2013-06-08 15:2

js中的DOM操作(1)

一.操作子节点 childNodes 通过该方式可以获取父节点下的所有子节点,但是由于浏览器的差异,这写节点中可能包含文本节点. <!DOCTYPE html> <html> <head> <title>json</title> <script type="text/javascript"> window.onload = function (){ var oUl = document.getElementById

JS中数组的操作

1.数组的创建 var arrayObj = new Array(); //创建一个数组 var arrayObj = new Array([size]); //创建一个数组并指定长度,注意不是上限,是长度 var arrayObj = new Array([element0[, element1[, ...[, elementN]]]]); 创建一个数组并赋值 要说明的是,虽然第二种方法创建数组指定了长度,但实际上所有情况下数组都是变长的,也就是说即使指定了长度为5,仍然可以将元素存储在规定长

JS中的DOM操作

一.DOM的创建 DOM节点(Node)通常对应于一个标签.一个文本.或者一个HTML属性.DOM节点有一个noteType属性用来表示当前元素的类型,它是一个整数: 1. Element, 元素 2. Attribite, 属性 3. Text,文本 DOM节点创建最常用的便是document.createElement和document.createTextNode方法: var node1 = document.createElement('div'); var node2 = docum