在frameset上可以在页面上面划分出多个区域，这是一般管理系统的主要布局方式，但是再一个页面可以调用另外一个页面的属性和方法。页面上可以包含iframe嵌套。
祖先页面：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript">
function top1(){
alert("祖先方法");
}
</script>
</head>
<frameset cols="50%,50%">
<frame src="html/1.html" name="c1"></frame>
<frame src="html/2.html" name="c2"></frame>
</frameset>
</html>
儿子1页面 1.html：
<!DOCTYPE html>
<html>
<head>
<title>1.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript">
$().ready(function(){
alert("左边加载完...");
alert($('span',window.parent.frames["c2"].document).text());
});
function xd1(){
alert("我是左边的方法");
}
</script>
</head>
<body>
11111111111111111111<p/>
<button onclick='window.parent.frames["c2"].xd2();'>调右边的方法</button>
<button onclick='window.parent.frames["c2"].frames["c21"].sunzi();'>调右边的儿子方法</button>
</body>
</html>
儿子二页面 2.html：
<!DOCTYPE html>
<html>
<head>
<title>2.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript" src="../js/jquery.min.js"></script>
<script type="text/javascript">
$().ready(function(){
alert("右边加载完...");
});
function xd2(){
alert("我是右边的方法");
}
</script>
</head>
<body>
<span>我是右边的属性</span>
2222222222222222222222
<div>
<iframe src="3.html" name="c21"></iframe>
</div>
</body>
</html>
二儿子的儿子页面 3.html：
<!DOCTYPE html>
<html>
<head>
<title>3.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
<script type="text/javascript">
function sunzi(){
alert("孙子方法");
}
</script>
</head>
<body>
我是页面2的儿子<p/>
<button onclick="window.parent.xd2();">父亲按钮</button>
<button onclick='window.parent.parent.frames["c1"].xd1();'>爷爷按钮</button>
<button onclick="window.top.top1();">祖先按钮</button>
</body>
</html>
frameset是最早的祖先页面。frame是祖先页面的子页面，原理和iframe是一样的。无论其方法调用还是祖父元素和兄弟页面之间调用都和iframe一样的。
参考链接：
http://747017186.iteye.com/blog/1985110
相关推荐
在提供的示例代码中，父页面和子页面分别使用了简单的JavaScript函数实现了相互之间的元素访问。这种直接访问DOM元素的方法简单直接，适合在同源策略允许的情况下使用。 - **父页面**： ```html 获取子页面文本" ...
例如，从父框架引用子框架可以使用 `window.frames["frameName"]`，从子框架引用父框架可以使用 `window.parent`，兄弟框架之间的引用可以通过父框架来实现。 对框架的操作 JS 操作 Frameset、Frame、Iframe 对象...
- 子框架可以通过`window.parent`属性引用其父框架，顶层框架的`window.parent`等于自身。 - 兄弟框架可以通过父框架引用，如`self.parent.frames["frameName"]`。 - 不同层次框架间的引用，可以通过逐级引用`...
在JavaScript中，调用父框架或者父页面的函数是一个常见的需求，特别是在构建多页面或有iframe嵌套的复杂Web应用时。以下将详细介绍几种不同的调用方式。 1. **调用父级中的函数** 当我们需要在子页面中调用父页面...
确保`<iframe>`加载的页面与包含它的页面位于相同的源（协议+域名+端口）下，或者`<iframe>`加载的页面明确通过`window.postMessage`等方式允许父页面访问其内容。 总的来说，通过使用JavaScript动态计算`<iframe>`...
本文将总结在iframe或frameset中嵌入子页面时，父页面和子页面之间交互的一些技巧。 首先，要理解JavaScript中的全局对象window，它是访问当前浏览器窗口的根对象。通过window对象，我们可以访问当前窗口下的所有...
在Web开发中，经常需要处理框架页面之间的交互，例如在父页面与子框架之间交换数据或调用函数等。本文将基于提供的内容，详细介绍如何使用JavaScript和jQuery来操作框架页面，具体包括以下几个方面： 1. **测试环境...
通过修改这些对象的属性或调用其方法，可以实现数据的传递。例如，可以在子框架中设置一个事件监听器，当文件上传完成后触发事件，并通过`window.parent.postMessage`向父框架发送消息。 4. **最小化窗口**：在Web...
页面的重新加载可以分为两种情况：当前页面的刷新和上级页面的刷新。 **当前页面的刷新**： 当前页面的刷新非常简单，只需要调用`document.location.reload()`方法即可。这个方法会重新加载当前页面，包括重新发送...
项目中遇到的一个浏览器不兼容问题： 在IE和Firefox下直接在ifame框架页的父窗口用子窗口的name调用子窗口的js函数都好使，在Chrome下不好使。 代码如下: <frameset rows=”108,*,30″ border=”0″ frameSpacing...
跨域页面访问问题是指在多个系统集成的情况下，主系统以 iframe 或 frameset 的方式将其他子系统的页面嵌进来，导致浏览器阻止 iframe 或 frameset 的 cookie，进而使 SESSION 失效。解决办法是，在子系统的登录代码...
在网页开发中，`frameset`、`frame`和`iframe`是用于创建网页布局的框架元素，允许在一个页面中嵌套多个独立的HTML文档。本文将深入探讨这些元素的JavaScript操作，特别是如何进行框架间的数据交换和交互。 首先，`...
这些区域通常称为子框架，每个都有自己的文档和独立的滚动条。在处理涉及多个框架的交互时，有时我们需要在这些框架之间传递数据，例如使用JavaScript。本文将详细讲解如何使用JavaScript在frame与frame之间进行值的...
综上所述，文章通过一个实际的示例代码，详细说明了如何监控iframe URL的变化，以及如何使用H5的新特性MutationObserver和兼容性处理技术来解决跨浏览器的监控问题。这对于前端开发者来说是一个非常实用的技巧，不仅...
关于JavaScript如何控制frameset以及如何操作frame中的内容，我们可以从几个关键知识点入手进行分析和讲解。首先，frameset在现代网页设计中已不常见，它主要用于早期的网页设计中，用于在一个浏览器窗口中显示多个...
第一种方法通过修改window.location.href属性，将用户重定向到一个新的页面，并且可以传递一个参数（如当前页面的URL）以便返回时能够回到原页面。 ```javascript window.location.href = "login.jsp?backurl=" + ...
例如，当从服务器获取数据后，可以通过JavaScript的`innerHTML`属性或`appendChild`方法将数据插入到表格中。如果使用了现代前端框架，如Vue.js，你可以定义一个数据模型，表格会自动响应模型的变化，实现数据驱动...