javascript学习随笔(使用window和frame)的技巧

答案：JavaScript允许创建和打开代表HTML文本, form对象和frame的窗口. window对象是JavaScript客户层次结构的最顶层对象, form元素和全部JavaScript代码都是存在于文档中,而文档被装载进窗口. 为了理解窗口怎样工作,你可以控制操作这些窗口.  

打开和关闭窗口 
当用户启动(launch)Navigator时,将自动创建一个窗口.用户还可以使用Navigator的File菜单上的New Web Browser打开一个窗口, 可以用Navigator的File菜单的Close或Exit关闭一个窗口.也可以用程序的办法来打开或关闭一个窗口. 

打开窗口 
用方法open创建一个窗口.下面语句创建了一个名为msgWindow的窗口,并在该窗口内显示文件sesame.html的内容. 

msgWindow=window.open("sesame.html") 

下面的这个语句能够创建一个名为homeWindow的窗口,用于显示Netscape的home page. 

homeWindow=window.open("http://www.netscape.com") 

窗口可以有两个名字.下述语句创建了一个有两个名字的窗口,第一个名字为msgWindow用于引用窗口的属性,方法和包含关系, 第二个名字displayWindow用于把窗口作为form提交 或超文本链的对象来引用时. 

创建窗口时,并不要求一定给出窗口名.但是你若打算从另一个窗口中引用此窗口,则此窗口必须有一个名字.有关使用窗口名字的信息参见windows and frames有关资料. 

打开窗口时,可以指定窗口属性,如窗口的高度,宽度,是否包含工具条,location域或滚动条等等.下述语句创建了一个没有工具条但带有滚动条的窗口. 

msgWindow=window.open 
("sesame.html","displayWindow","易做图=no,scrollbars=yes") 

有关窗口的属性的细节请参见OPEN 方法.  

关闭窗口 
可以在程序中使用方法close来关闭一个窗口.不允许只关闭一个frame, 而不关掉整个父窗口. 

下述语句均可关闭当前窗口: 

window.close() 
self.close() 
//此语句不能用在事件处理程序中 
close() 

下述语句关闭了一个名为msgWindow的窗口: 

msgWindow.close() 



-------------------------------------------------------------------------------- 

  

使用frame 
frame是一种特殊的窗口,它可以在一个窗口显示多个独立滚动的frame.每个frame又有各自不同的URL. 各frame可以指向不同的URL,也可以作为其它URL目标,但必须在同一个窗口内. 一系列的frame 组成页(page). 

下图是一个含有三个frame的窗口 

            This frame is                     This frame is 
named listFrame                   named contentFrame 

|                                   | 
-----------------v-----------------------------------v------------ 
| Music Club            |      Toshiko Akiyoshi                  | 
| Artists               |         Interlude                      | 

| Jazz                  |      The Beatles                       | 
| - T. Akiyoshi         |         Please Please Me               | 
| _ J. Coltrame         |                                        | 
| - M. Davis            |      Betty carter                      | 
| - D. Gordon           |         Ray Charles and Betty Carter   | 

| Soul                  |      Jimmy Cliff                       | 
| - B. Carter           |         The Harder They Come           | 
| _ R. Charles          |                                        | 
|     ...               |         ...                            | 
------------------------------------------------------------------ 
| Alphabetical By category Musician Descriptions                 | 
-----------------^------------------------------------------------ 

| 
This frame is named 
navigateFrame 
创建一个frame 
在HTML文档中使用<frameSET>标记就可以创建一个frame. <frameSET>标记在HTML文档中的唯一作用就是定义组成页的各个frame的布局(layout). 

例1 下述语名定义了上图所示的一组frame 

<FRAMESSET ROWS ="90%,10%"> 
　<FRAMESET COLS="30%,70%"> 
　　　<FRAME SRC=category.html NAME="listFrame"> 
ALT="BACKWARD" HEIGHT=32 WIDTH=32> 　　　<FRAME SRC=titles.html NAME="contentFrame> 
ALT="BACKWARD" HEIGHT=32 WIDTH=32> 　</FRAMESET> 
　<FRAME SRC =navigate.html NAME="navigateFrame">  
</FRAMESET> 

下图给出了这些frame的层次结构,虽然有两个frame是在另一个frameset中定义的,但这三个frame有同一个父亲, 这是因为frame的父亲是它的父窗口,而窗口是由frame而不是frameset确定的. 

top 

+--listFrame (category.html) 

+--contentFrame(titles.html) 

+--navigateFrame(navigate.html) 
你也可以数组frames引用上述的frame(有关数组frames的信息参见frame对象): 
listframe 用 top.frame[0]表示  
contentframe 用 top.frame[1]表示  
navigateframe 用 top.frame[2]表示  
例2 可以用另一个办法创建上述窗口: 最前面的两个frame与navigateFrame各有不同的父辈,顶层的frameset定义如下: 

<FRAMESSET ROWS ="90%,10%"> 
　　<FRAME SRC=muske13.htm NAME="upperFrame"> 
ALT="BACKWARD" HEIGHT=32 WIDTH=32> 　　<FRAME SRC=navigate.html NAME="navigateFrame> 
ALT="BACKWARD" HEIGHT=32 WIDTH=32> </FRAMESET> 

文件muskel3.html包含了上述frame的骨架,并定义了下述frameset. 

<FRAMESSET COLS ="30%,70%"> 
　　<FRAME SRC=categroy.html NAME="listFrame"> 
ALT="BACKWARD" HEIGHT=32 WIDTH=32> 　　<FRAME SRC=titles.html NAME="contentFrame> 
ALT="BACKWARD" HEIGHT=32 WIDTH=32> </FRAMESET>  

下图说明了这几个frame的层次关系upperFrame和navigateFrame共享一个父辈:最顶的window. 而listFrame和contentFrame共享一个父辈:upperFrame. 

top 

|                        +--listFrame 
|                        | (category.html) 
+---upperFrame-----------| 
|  (muske13.html)        | 
|                        +--contentFrame 
|                           (titles.html) 

+--navigateFrame 
(navigate.html) 
可以用下面的办法引用这些frame(关于frame数组的信息参见frame对象). 
upperFrame 用 top.frame[0]表示  
navigateFrame 用 top.frame[1]表示  
listFrame 用 upperFrame.frames[0] 或top.frames[0].frames[0]表示  
contentFrame 用upperFrame.frames[1] 或top.frames[0].frames[1]表示  
更新frame(updating frames) 
只要你说明了frame层次结构,你可以用location属性来设置URL, 以更新frame的内容.  

例如,在使用上节例2中frameset时,若希望用户能够关闭含有字母序或分类序的画家列表的frame(名为listframe),且只想看到按作曲家排序的作品标题(在contentFrame中), 则可以向navigateFrame 中加入如下按钮. 

<INPUT TYPE="button" VALUE="Titles Only" 
onClick="top.frames[0].location='artists.html'"> 

当用户按动此按钮时,文件artist.html被加载到名为upperFrame的frame中,而listFrame和contentFrame被关闭,且不再存在. 

引用frame和在frame之间浏览(navigate) 
因为frame是一种窗口,所以你可以与使用窗口类似的办法引用frame和在frame 之间浏览. 

frame的例子 
在上一节中, 若frameset被设计为一个音乐俱乐部的可用的标题,则这些frame及其HTML文件包括下述的内容: 

category.html 位于listFrame中, 放有按分类排序的作曲家列表  
titles.html 位于contentFrame中, 放有按字母序列里各作曲家姓名及该作曲家的作品标题.  
navigate.html 位于navigateFrame中, 放有超文本链, 使用户选择怎样在listFrame中显示作曲家:以字母序或分类序.这个文件还定义了一个超文本链, 使用户可以显示每个作曲家的简介.  
附加文件alphabet.html 放有按字母排序的作曲家,当用户想显示字母序列表时,按动此链,这个文件中就显示在listFrame中.  
文件category.html (按分类排序)包含的代码类似于下述: 

<B>Music Club Artists</B> 
<P><B>Jazz</B> 
<LI><A HREF=><LI><A HREF=><LI><A HREF=><LI><A HREF=>
<P><B>Soul</B> 
<LI><A HREF=><LI><A HREF=>... 

文件 alphabet.html (按字母排序) 包含的代码类似于下述: 

<B>Music Club Artists</B> 
<LI><A HREF=titles.html#0001 TARGET="contentFr

上一个：原型方法的不同写法居然会影响调试的解决方法
下一个：IE7提供XMLHttpRequest对象为兼容