JavaScript程序设计:基础·PHP·XML
上QQ阅读APP看书,第一时间看更新

1.6.7 open()和close()方法

网页几乎总是包含到网站中其他页面的链接。然而,你有时可能不想用户离开当前页而又想要用户看到新页面的内容。当单击链接时,你可以使用JavaScript打开新的窗口,从而使用户能够在新页面和原页之间切换。同样,你可以使用JavaScript关闭窗口。打开窗口的语法看起来有一点复杂,有很多选项:

对于open()方法,第一个参数是URL,它指定要打开页面的网址。如果没有指定URL,那么浏览器将打开空白页面。

参数name是可选择的,它指定窗口的目标属性或名字。支持下列值:

·_blank:将URL指定的页面载入一个新窗口,这是默认值。

·_parent:将URL指定的页面载入父框架。

·_self:将URL指定的页面替换当前页。

·_top:将URL指定的页面替换任何可能被装载的框架集。

·name:为新建窗口指定名字。

参数specs提供许多选项,可以使用这些选项定义新窗口的大小或位置。例如,可以将新窗口指定为一个小窗口、有一个滚动条或许多其他选项。表1-5列出了很多能够被大多数浏览器支持的选项。

表1-5 window.open()的可选规格(以逗号分隔相邻项目)

最后,参数replace是可选的,它指定URL是否应该在历史列表中建立一个新条目或者替换当前条目。如果它设置为true,则URL将替换历史列表中的当前文档;如果它设置为false,则URL将建立一个新条目。close()方法用来关闭窗口,你可能将它与一个按钮关联以允许用户关闭一个已打开的窗口。例1.18混合使用了window.open()和window.close()方法。

例1.18 使用window.open()和window.close() 这个例子使用window.open()方法打开一个显示一些文本的小窗口,其中的按钮用来让用户打开或者关闭这个新窗口。

在最初装载时,页面看起来像这样:

当用户单击“Opena small window”按钮时,第17行的指令调用<head>区域起始于第5行的函数openWin(),创建变量smallWindow,其值是通过window.open()方法定义的新窗口。第1个参数URL没有定义,即赋值为空串(“”),意味着没有URL。如果在引号内放置了URL,那么新窗口将显示这个网址的页面。第2个参数name也是空的,意味着这个新窗口没有标识的名字。第3个参数为新窗口列出规格,即创建一个300个像素宽和200个像素高的小窗口,这只是表1-5所列的一些规格。最后,没有给出可选参数replace,因为这个窗口不需要在浏览器历史中替换任何东西。

第8行定义新窗口的内容,注意点标记用来标识在哪里放置内容。smallWindow.document.write()描述在哪里写新内容,即在新窗口(smallWindow)的文档中。内容本身放置在write()方法的圆括号内,并且用引号括起来。注意也可以包括任何HTML格式。在这个例子中,内容包含在<p></p>标签对内,并且包括强制换行(<br/>)。在单击“Open a small window”按钮之后,屏幕看起来像这样:

当用户单击第二个按钮“Close the small window”时,第18行调用第10行的函数closeWin(),它使用close()方法简单地关闭smallWindow。

1.6节检查点

1.23 填空题:所有对象有________和________。

1.24 哪个JavaScript方法让你在一个网页上显示文本?

1.25 写一条JavaScript语句,当调用时将以2级标题格式显示一条欢迎信息,显示"Welcome to my world!"。

以下代码用于检查点1.26和1.27。

1.26 写一条JavaScript语句,它使用getElementById()方法访问其id="cars"的容器的内容,并且将变量命名为auto。

1.27 写一条JavaScript语句,显示"cars"容器的内容。

1.28 写一条按下列规格打开新窗口的JavaScript语句:窗口的高度是600个像素,宽度是400个像素,并且为新窗口指定名字"extraInfo"。