1.父框架到子框架的引用
知道了上述原理,从父框架引用子框架变的非常容易,即:
window.frames["frameName"];
这样就引用了页面内名为frameName的子框架。如果要引用子框架内的子框架,根据引用的框架实际就是window对象的性质,可以这样实现:
window.frames["frameName"].frames["frameName2"];
这样就引用到了二级子框架,以此类推,可以实现多层框架的引用。
2.子框架到父框架的引用
每个window对象都有一个parent属性,表示它的父框架。如果该框架已经是顶层框架,则window.parent还表示该框架本身。
3.兄弟框架间的引用
如果两个框架同为一个框架的子框架,它们称为兄弟框架,可以通过父框架来实现互相引用,例如一个页面包括2个子框架:
<frameset rows="50%,50%">
<frame src="1.html" name="frame1" />
<frame src="2.html" name="frame2" />
</frameset>
在frame1中可以使用如下语句来引用frame2:
self.parent.frames["frame2"];
4.不同层次框架间的互相引用
框架的层次是针对顶层框架而言的。当层次不同时,只要知道自己所在的层次以及另一个框架所在的层次和名字,利用框架引用的window对象性质,可以很容易地实现互相访问,例如:
self.parent.frames["childName"].frames["targetFrameName"];
5.对顶层框架的引用
和parent属性类似,window对象还有一个top属性。它表示对顶层框架的引用,这可以用来判断一个框架自身是否为顶层框架,例如:
//判断本框架是否为顶层框架
if(self==top){
//dosomething
}
改变框架的载入页面
对框架的引用就是对window对象的引用,利用window对象的location属性,可以改变框架的导航,例如:
window.frames[0].location="1.html";
引用其他框架内的javascript变量和函数
在介绍引用其他框架内javascript变量和函数的技术之前,先来看以下代码:
<script language="javascript" type="text/javascript">
</script>
当时的例子,要求form刷新或关闭,提示,如果是已经保存就不用提示
//保存form表单,并且更改form表单默认值为保存后的数据
function save(btn){
var form=btn.parentNode;
for (var i = 0; i < form.elements.length; i++) {
var element = form.elements[i];
element.defaultValue=element.value;
}
form.submit();
}
//验证form表单数据是否有更改
function formIsDirty(form) {
for (var i = 0; i < form.elements.length; i++) {
var element = form.elements[i];
var type = element.type;
if (type == "text"){
if (element.value != element.defaultValue) {
return true;
}
}
}
return false;
}
//刷新或关闭页面时,判断form表单数据是否有更改
window.onbeforeunload = function(e) {
e = e || window.event;
<%
for(int i=2;i<SupItem.ITEM_TYPE.length;i++)
{
%>
if (formIsDirty(window.frames['_score'].document.forms["form<%=i%>"])) {
if (e) {
e.returnValue = "您的评分数据尚未保存,是否确认离开本页?";
}
return "您的评分数据尚未保存,是否确认离开本页?";
}
<%
}
%>
};
相关推荐
### JavaScript框架相互引用详解 #### 一、框架与Window对象的关系 在JavaScript中,每一个框架(通常指的是`iframe`)都是一个独立的浏览器窗口。因此,对于任何框架来说,其本质都是一个`window`对象。这意呸着...
在探讨“十大JavaScript框架”这一主题时,我们深入解析了多个关键框架,这些框架在现代Web开发中扮演着至关重要的角色。以下是对每个框架的详细分析: ### 1. Prototype Prototype是最早一批的JavaScript库之一,...
在`theSon.html`中,有一个JavaScript函数`setValue()`,该函数负责获取子框架中文本框的值,并将其传递给父框架的文本框。当用户点击“提交”按钮时,`setValue()`会被调用。 ```javascript // 在theSon.html中 ...
我们可以定义一个函数来获取子IFRAME框架的高度,然后将其设置为table元素的高度,以便子IFRAME框架的高度能够正确地自动调整。 通过使用JavaScript来让IFRAME框架的高度自适应,我们可以实现IFRAME框架的高度自动...
"自定义JS类框架"指的是开发者根据自身需求,利用JavaScript语言特性(如原型链、闭包、模块化等)和jQuery库,构建的一种自定义的框架。这个框架可能是为了简化DOM操作、提供更高级别的API、优化性能或者实现特定的...
本文将深入探讨如何在Delphi环境中与JavaScript进行交互,特别是如何从JavaScript端获取返回值,这在实现桌面应用与Web内容的集成时非常有用。 Delphi是一种流行的面向对象的 Pascal 编程语言,它提供了丰富的库和...
- **JavaScript方法**: 使用 `document.getElementById("ifr1").contentWindow.document.getElementById("txt1")` 获取子框架内的元素,并通过 `value` 属性设置内容。 - **jQuery方法**: 利用 `$` 函数结合 `...
Ext框架JavaScript开源框架Ext框架JavaScript开源框架
在实际开发中,我们可能需要使用 JavaScript 库或框架来简化获取元素坐标的过程,例如 jQuery 库提供了一个 offset() 方法,可以直接获取元素相对于文档的坐标。 获取页面控件坐标是 JavaScript 编程中非常重要的一...
"js 父窗体子窗体数据交互"这个主题涉及到JavaScript(js)技术,DHTML(动态HTML)以及相关的脚本编程。以下将详细介绍如何使用JavaScript来实现这种交互。 1. **JavaScript 基础**: JavaScript 是一种广泛使用...
4. **NestJS框架**:NestJS是一个渐进式的企业级JavaScript框架,它受到了Angular的影响,引入了依赖注入和模块化等概念。NestJS旨在提高代码的可测试性和可维护性,适用于构建大型、复杂的Web应用。 5. **Total.js...
网页内自适应高度框架JS是一种基于JavaScript实现的页面布局技术,它允许开发者创建灵活的页面结构,自动调整元素的高度以适应不同的屏幕尺寸和浏览器窗口大小。这种技术在响应式网页设计中尤其重要,因为它能够确保...
JavaScript UML2框架,简称js uml2,是一种专门用于在Web环境中绘制统一建模语言(UML)图的工具。UML是一种广泛使用的建模语言,它为软件开发提供了标准化的方法来描述系统的设计、结构和行为。js uml2框架使得...
使用原生JS代码开发一个前端框架,框架名称SYSUI,纯原生js开发,不使用任何第三方库。SYSUI本身支持网站模板界面编辑开发,也支持配置后台系统界面,是个多用途的框架。 使用SYSUI开发一个后台管理系统界面,支持...
Vue.js 是一款流行的前端 JavaScript 框架,它是一款轻量级、高性能的框架,用于构建交互式的用户界面和单页应用程序。Vue.js 的特点包括: 响应式数据绑定:Vue.js 实现了数据的双向绑定,当数据发生变化时,视图...
仿照 jquery源码编写的 简易框架的源码 出自的妙味课堂远程课
如果iframe的内容与父窗口内容不是同源的(即协议、域名或端口任一不同),那么window.parent可能会返回null,导致无法获取到父窗口的任何信息。此时需要通过其他方式来实现跨域数据传输,比如使用postMessage API...
"JavaScript 框架详解" 在 JavaScript 开发中,框架扮演着非常重要的角色。选择合适的框架可以提高开发效率,简化代码编写,提高应用程序的性能。在面试中,框架也是常被问到的题目之一。下面我们将详细介绍七个...
JavaScript框架是预编写的一系列代码,用于简化JavaScript开发,提供可重用的组件,促进快速开发。它们通常包含用于处理DOM操作、事件管理、数据绑定、路由和动画等功能。一些知名的JavaScript框架包括: 1. ...
本篇文章将深入探讨几个流行的JavaScript框架——React、Angular、Vue.js和Ember.js的性能差异,旨在为开发者提供决策参考。 首先,React是由Facebook开发并维护的库,主要用于构建用户界面,特别是单页面应用(SPA...