如果页面包含框架,则每个框架都拥有自己的window对象,并且保存在frames集合中,可以通过数字索引(从0开始,从左右到右,从上到下)或者框架名称来访问相对应的window对象。

每个window对象都有一个name属性,其中包含着框架的名称。

inded.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>JavaScript</title>
</head> <frameset rows="160,*">
<frame src="frame.html" name = "topFrame">
<frameset cols="50%,*" name = "innerFrameset">
<frame src="anotherFrame.html" name="leftFrame">
<frame src="yetanotherFrame.html" name="rightFrame">
</frameset>
</frameset> </html>

frame.html

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body> <div>
topFrame.html
</div> <script type="text/javascript">
var frameName = "topFrame-frame.html"; </script>
</body>
</html>

anotherFrame.html:

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body> <div>
anotherFrame.html
</div> <script type="text/javascript">
var frameName = "leftFrame-anotherFrame.html";
var topwindow = window.top;
var parentWindow = window.parent;
var frame1 = topwindow.frames[0].frameName;
var frame2 = topwindow.frames["leftFrame"].frameName;
console.log(frame1); // topFrame-frame.html
console.log(frame2); // leftFrame-anotherFrame.html
console.log(window.name); // leftFrame
</script>
</body>
</html>

yetanotherFrame.html

<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
</head>
<body> <div>
yetanotherFrame.html
</div> <script type="text/javascript"> var frameName = "rightFrame-yetanotherFrame.html";
</script>
</body>
</html>

window对象的属性(与框架有关的):

top:任何一个 window 对象的 top 属性都指向最高层框架,也就是浏览器窗口。而window对象一般都是特定的框架实例,不一定就是最高窗口。

parent:指向当前框架的直接上层框架。parent有可能等于 top,在没有框架的情况下 window、top、parent 都相等。

self:self 就只指向window。

可以跨框架访问另一个框架页面中window的属性。

web 浏览器窗口window 与框架 frameset 的关系的更多相关文章

  1. Helium文档12-WebUI自动化-go_to在当前的Web浏览器窗口中打开指定的URL

    前言 go_to在当前的Web浏览器窗口中打开指定的URL 入参介绍 url def go_to(url): """ :param url: URL to open. : ...

  2. web 浏览器窗口

    1.窗口位置: 取得浏览器窗口左边和上边距屏幕左边和上边的位置 var leftPos = (typeof window.screenLeft == "number")? wind ...

  3. (转)浏览器对象window,history,location,navigator,screen

    1.window对象:当前的浏览器窗口 window对象是BOM的核心,window对象指当前的浏览器窗口 所有JavaScript全局对象.函数以及变量均自动成为window对象的成员 全局变量是w ...

  4. web浏览器中javascript

    1.异步载入一个js代码function loadasync(url) { var head = document.getElementsByTagName("head")[0]; ...

  5. Frameset框架,在同一个浏览器窗口中显示不止一个页面

    总结一下.通过使用Frameset框架,可以在同一个浏览器窗口中显示不止一个页面. 先举个例子: 1 <frameset rows="100,*" cols="*& ...

  6. 打开新窗口(window.open) open() 方法可以查找一个已经存在或者新建的浏览器窗口。 语法: window.open([URL], [窗口名称], [参数字符串])

    打开新窗口(window.open) open() 方法可以查找一个已经存在或者新建的浏览器窗口. 语法: window.open([URL], [窗口名称], [参数字符串]) 参数说明: URL: ...

  7. 各浏览器对 window.open() 的窗口特征 sFeatures 参数支持程度存在差异

    标准参考 无. 问题描述 使用 window.open 方法可以弹出一个新窗口,其中 open 方法的 sFeatures 参数选项在各浏览器中支持程度不一,这有可能导致同样的代码使各浏览器中弹出窗口 ...

  8. WebDNN:Web浏览器上最快的DNN执行框架

    WebDNN:Web浏览器上最快的DNN执行框架 为什么需要WebDNN? 深层神经网络(DNN)在许多应用中受到越来越多的关注. 然而,它需要大量的计算资源,并且有许多巨大的过程来设置基于执行环境的 ...

  9. 第三百三十三节,web爬虫讲解2—Scrapy框架爬虫—Scrapy模拟浏览器登录—获取Scrapy框架Cookies

    第三百三十三节,web爬虫讲解2—Scrapy框架爬虫—Scrapy模拟浏览器登录 模拟浏览器登录 start_requests()方法,可以返回一个请求给爬虫的起始网站,这个返回的请求相当于star ...

随机推荐

  1. threading的join功能

    you can go here to see the details. 我的理解:使用join后,使主线程执行完后(挂起),子线程再执行完后,主线程才结束.否则主线程会直接结束导致子线程不会执行. i ...

  2. 函数getpass

    函数getpass为python自带函数,作用是使用户输入的内容不可见 1 # -*- coding:utf-8 -*- 2 import getpass 3 a = raw_input(" ...

  3. python中str的索引、切片

    1 a = "hello" 2 a1 = a[1] 3 a2 = a[0:2] 4 print(a1) 5 print(a2) 我们通过索引获取字符串中指定位数的字符 通过切片获取 ...

  4. winform 之公共控件

    Button 按钮 属性: (一).布局: 1.AutoSize:控件是否根据内容调整大小 2.Location:当前按钮位于界面位置 3.Dock:控件锁定到界面位置 -None:不锁定 4.Mar ...

  5. requestAnimFrame动画兼容性封装

    window.requestAnimFrame=function(){ return window.requestAnimationFrame ||window.webkitRequestAnimat ...

  6. Android自定义ProgressBar样式

    我们使用的进度条多种多样,下面有几种自定义的进度条的样式,下面介绍几个. 进度条的有基本的四种样式: 默认风格的进度条: android:progressBarStyle 水平长型进度条: andro ...

  7. 天天向上的力量 III(python在pycharm实现)

    '''描述一年365天,以第1天的能力值为基数,记为1.0.当好好学习时,能力值相比前一天提高N‰:当没有学习时,能力值相比前一天下降N‰.每天努力或放任,一年下来的能力值相差多少呢?其中,N的取值范 ...

  8. Node Koa2 完整教程

    请移步 http://cnodejs.org/topic/58ac640e7872ea0864fedf90

  9. 1.深入分析_NIO性能分析

    首先还是看一个用3中方式copy文件的测试Demo 分别是:普通Stream文件copy,BuffferedStream进行Copy 和Channel(nio)进行文件Copy的代码和性能测试报告: ...

  10. mysqldump备份时保持数据一致性

    对MySQL数据进行备份,常见的方式如以下三种,可能有很多人对备份时数据一致性并不清楚 1.直接拷贝整个数据目录下的所有文件到新的机器.优点是简单.快速,只需要拷贝:缺点也很明显,在整个备份过程中新机 ...