JavaScript学习(6)使用窗口和框架
来源:互联网 发布:方立勋java web 编辑:程序博客网 时间:2024/06/05 00:17
1.用对象控制窗口
1.1访问窗口属性和方法
窗口对象的属性和方法的脚本引用有两种,其中最符合逻辑、最通用的方法是在引用中包含window对象。如:window.propertyName。当脚本引用指向存放文档的窗口时,window对象还有一个同义字self,如:self.propertyName。用户可以交替使用这些初始引用对象名,但是在更为复杂的、涉及更多框架和窗口的脚本中使用self更适合。self名可以清晰地存放脚本文档的当前窗口,它使得脚本对于所有用户更容易读。因为window对象在脚本运行时都是一直存在的,所以窗口内任何对象在引用它时都可以忽略它,如:propertyName。
1.2创建新窗口
如果要打开一个指定大小的心窗口,并且要求这个窗口处于当前页面的同一个服务器目录下的HTML文档中,就可以使用如下的语句:
var subWindow = window.open("define.html" , "def", "height = 200, width = 300");
假如需要访问它的一个属性或方法,必须把这个引用作为整个引用的一部分。如:
subWindow.close();
实例:
2.窗口属性
本节主要讨论window的属性,下表列出了IE支持的window对象的属性
closed 表示窗口是否已经关闭
dafaultstatus 指定在浏览器窗口中底部状态栏中,显示的默认状态信息
frames window对象中包含的所有frame对象的数组
length 表示window对象中包含的帧的个数
location 表示与window对象相关的URL的地址
name 窗口标识
opener 标识打开窗口的window对象
parent “双亲”,与包含某个窗口的父窗口含义相同
self “窗口自身”,与引用的当前窗口含义相同
status 指定浏览器状态栏中出现的临时性信息
top 指一系列嵌套窗口中的最上层浏览器窗口
screen 存储窗口所在屏幕信息的子对象(分辨率等)
2.1closed属性
示例:
2.2status属性
设置窗口的status属性是非常简单的事情,通常脚本语句作为事件处理定义中的内嵌脚本来运行。这对于短的脚本来说非常方便,因为不必说明一个单独的函数或在页面上加入<script>标记,仅仅需要把脚本语句加入<a>标记即可。
示例:
2.3opener属性
许多脚本开发人员都有这样的一种错误想法,认为由window.open()方法创建的浏览器窗口有一个父子关系,正如一个框架与它的父亲框架一样。其实实际情况不是这样,新的浏览器窗口一旦创建,与它的源窗口只有很小的关系,即opener属性。该属性的目的在于为新窗口中的脚本提供一个有效地引用,使之回到源窗口中。
示例:
3.窗口的方法
IE支持的window对象的方法
alert() 显示提示信息对话框
confirm() 显示确定对话框
find() 当触发该方法时,将弹出一个find对话框
Print() 模拟用户单击浏览器上的“打印”按钮,通知浏览器打开“打印”对话框
Prompt() 显示要求键盘输入
Open() 打开指定窗口
Close() 关闭指定窗口
Blur() 删除窗口的焦点属性
Focus() 将焦点属性移动到特定窗口
Moveby() 按照给定像素参数移动指定窗口
Moveto() 将窗口移动到指定的坐标(x,y)处
Resizeby() 讲窗口中的内容按给定的位移量滚动。参数为正,正向滚动;否则反向
Scrollto() 将窗口中的内容滚动到指定位置
Setinterval() 经过定时时间后,对表达式重复求值
Clearinterval() 取消Setinterval设置的定时
Settimeout() 经过定时时间后,对表达式求职
Cleantimeout() 消除以前的定时设置
3.1alert()方法
该方法用来显示一个警告对话框,该对话框显示传给参数的文本,它类似于由MsgBox函数产生的信息框,但只含一个“确定”按钮。在执行该方法时,讲显示一条信息并将保持在屏幕上,脚本的执行过程被暂停,知道用户单击“确定”按钮。
示例:
3.2confirm方法
confirm方法和alert方法很相似,它也是现实一个信息框,但这个信息框有两个按钮,分别为“确定”和“取消”。如果单击“确定”按钮,则confirm方法返回true;如果单击“取消”按钮,则返回false。
示例:
3.3prompt()方法
prompt方法用来提示用户输入数据,它类似于inputbox函数。prompt()方法接受两个参数,其中一个是提示信息,另一个是可选的默认信息。执行该方法后显示一个对话框,让用户输入信息,输入后单击“确定”按钮,将返回用户在对话框输入的信息。
示例:
3.4moveTo()方法
moveTo()方法和moveBy()方法的区别就在于一个是绝对运动,另一个是与当前窗口位置相关的相对运动。为moveTo制定的参数就是屏幕上窗口的左上角的横坐标和纵坐标;相反moveBy的参数表示在每个方向上要将窗口调整多远。
示例:
4.使用超时功能
使用window对象的setTimeOut方法,可以指定一个延时及延时之后开始执行的指令。调用setTimeOut()方法,即可启动一个超时功能。该方法有两个参数,第一个是在括号中的一条(或一组)Javascript语句,第二个是以毫秒(千分之一秒)为单位等待时间。举例来说,下面这条语句将在10秒后显示一个警示对话框。
ident = window.setTimeOut("alert('Time is up!')", 10000);
我们有时候会希望语句能够反复执行,如脚本可能用于更新时钟,需每秒更新一次。重复超时功能的方法是,在该超时期限调用的函数再次调用setTimeOut()方法。
示例:
5.使用框架
5.1创建框架
<framset>用来定义一组框架或其它框架集,其属性如下:
Border 指定框架边框的宽度(以像素为单位)
frame border yes或1表示三维边框;no或0表示平面框架
Rows 指定在垂直方向上将窗口划分为几个框架以及每个框架的大小
Cols 指定在水平方向上将窗口划分为几个框架以及每个框架的大小
<frame>定义单个框架的属性
Name 框架名称,JavaScript通过名称来引用框架
Src 框架中显示内容的URL地址
Scrolling 默认auto表示浏览器必要时提供滚动,yes总显示滚动,no总不滚动
Marginwidth 指定框架内容里框架左右边界的距离,以像素为单位
Marginheight 指定框架内容以及框架上下边界的距离,以像素为单位
示例:
将窗口划分为两个框架:上框架占30%,下框架占70%。第一个文件定义框架的划分,第二个文件包含上框架定义的页面,第三个文件包含下框架的页面。
5.2frame对象
在JavaScript中,HTML框架用一个frame对象数组frames[]表示。该数组是window对象的一个属性,每个数组元素表示一个框架,frames[1]代表<frameset>标记中的第二个框架,以此类推。引用方式为:
window.frames[i];
window.frames["frameName"];
window.frameName;
6.菜单设计
6.1创建菜单
在下面的示例中,使用框架将窗口分为两部分:左框架中显示一个链接组成的菜单,单击这些菜单时改变右框架中的背景颜色;右框架中显示一段唐诗和一段文字,用于演示菜单操作的结果。
6.2隐藏菜单
有时在选择菜单项后,需要将菜单隐藏起来,以提供更多的显示空间。
示例:
7.screen对象
screen对象也是window对象的一个属性。当加载Web页面时自动创建screen对象。它给出了用户计算机中的各种显示特性,包括屏幕像素宽度、高度、颜色深度等。在设计对显示特性有特殊要求的网页时,screen对象就比较有用了,比如根据用户屏幕的大小调整页面上图像显示空间大小等。screen对象的属性如表所示:
availHeight 屏幕可用高度,以像素为单位
availWidth 屏幕可用宽度,以像素为单位
height 屏幕高度,以像素为单位
width 屏幕宽度,以像素为单位
colorDepth 颜色深度,使用像素位数表示
8.综合应用
为了加深对所学知识的理解,下面的例子使用了窗口的某些属性。代码执行后,会在3秒内探出对话框。
- JavaScript学习(6)使用窗口和框架
- JavaScript窗口和框架
- javascript中的窗口和框架
- javascript中的窗口和框架
- JavaScript窗口功能指南之命名窗口和框架(转)
- JavaScript窗口功能指南之命名窗口和框架
- JavaScript窗口功能指南之命名窗口和框架
- JavaScript使用框架和Cookies
- 6框架、文档和窗口
- javascript网页特效——窗口和框架
- 窗口框架的使用
- 5.窗口和框架
- javascript基础教程第8版---第5章窗口与框架---学习笔记
- 子框架中使用javascript更改当前浏览器窗口的url
- JavaScript对框架窗口的控制
- javascript开发系列(框架、窗口)
- JavaScript - 模式窗口和非模式窗口
- web javascript 框架学习
- PHP缓存机制的具体讲解
- 获取控件绝对位置,显示div
- org.w3c.dom对XML的操作示例
- linux 不删除文件,清空文件内容命令
- Linux内核参数传递Tag
- JavaScript学习(6)使用窗口和框架
- Web Services&XML:使用XML的五种场合
- Java 理论与实践: 处理 InterruptedException
- 搜索引擎入门 -- 实战准备
- flex 4 运行时改变显示层次.类似z轴功能.
- android 调试.so
- SQL汇总一
- 做职业监理师(五)——抵抗压力的心态
- 浅析项目失败的原因