📄 javascript7.htm
字号:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<style>
<!--
a{ text-decoration: none }
p{ line-height:140% }
.text{ font-size: 9pt }
.text{ text-align:justify }
.text11{ font-size: 11pt }
.text11{ text-align:justify }
-->
</style>
<meta name="GENERATOR" content="Microsoft FrontPage 3.0">
<title>网页教程-JavaScript技术讲座:第七讲 窗口及输入输出</title>
</head>
<p align="center"><span class="text">您现在的位置:<a href="javascript:if(confirm('http://www.4gee.com/Index.htm \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address. \n\nDo you want to open it from the server?'))window.location='http://www.4gee.com/Index.htm'" tppabs="http://www.4gee.com/Index.htm">主页</a>-<a
href="javascript:if(confirm('http://www.4gee.com/colleges/Index.htm \n\nThis file was not retrieved by Teleport Pro, because it is addressed on a domain or path outside the boundaries set for its Starting Address. \n\nDo you want to open it from the server?'))window.location='http://www.4gee.com/colleges/Index.htm'" tppabs="http://www.4gee.com/colleges/Index.htm">网络教室</a>-<a href="Index.htm" tppabs="http://www.4gee.com/colleges/homepages/Index.htm">主页工厂</a>-JavaScript技术讲座:第七讲
窗口及输入输出</span></p>
<p align="center"><small><a href="JavaScript6.htm" tppabs="http://www.4gee.com/colleges/homepages/JavaScript6.htm">上一页</a>
<a href="JavaScript8.htm" tppabs="http://www.4gee.com/colleges/homepages/JavaScript8.htm">下一页</a></small></p>
<div align="center"><center>
<table border="0" width="100%">
<tr>
<td width="100%"><p align="center"><span style="color: rgb(252,177,3)" class="text11">JavaScript技术讲座<br>
第七讲 窗口及输入输出</span></td>
</tr>
</table>
</center></div><div align="center"><center>
<table border="0" width="100%">
<tr>
<td width="100%"><p align="center"><font lang="ZH-CN"><span
style="color: rgb(125,125,125)" class="text"> JavaScript是基于对象的脚本编程语言,那么它的输入输出就是通过对象来完成的。其中有关输入可通过窗口(Window)对象来完成,而输出可通过文档(document)对象的方法来实现。</span></font></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>一、窗口及输入输出</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">请看下面例子:</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><HTML></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><Head></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><script
languaga="JavaScript"></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">Var
test=window.prompt("请输入数据:");</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">document.write(test+"JavaScript输入输出的例子");</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"></script></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"></Head></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"></HTML></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"> <font lang="ZH-CN">其中window.prompt()就是一个窗口对象的方法,其基本作用是,当装入Web页面时在屏幕上显示一个具有“确定”和“取消”的对话框,让你输出数据。document.writle是一个文档对象的方法,它的基本功能,是实现Web页面的输出显示。见图1所示。</font></span></p>
<p><img src="javascript/Image8.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Image8.gif" width="488" height="118"
alt="Image8.gif (6176 字节)"><span style="color: rgb(125,125,125)" class="text"><font
lang="ZH-CN"> </font></span><dir>
<dir>
<dir>
<dir>
<dir>
<dir>
<dir>
<dir>
<dir>
<dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">图1</font></span></p>
<p> </p>
</dir>
</dir>
</dir>
</dir>
</dir>
</dir>
</dir>
</dir>
</dir>
</dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>1、窗口对象</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 该对象包括许多有用的属性、方法和事件驱动程序,编程人员可以利用这些对象控制浏览器窗口显示的各个方面,如对话框、框架等。在使用应注意以下几点:</font></span><dir>
<dir>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 该对象对应于HTML文档中的<Body>和<FrameSet>两种标识;</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> onload和onunload都是窗口对象属性;</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 在JavaScript脚本中可直接引用窗口对象。如:</font></span><dir>
<dir>
<dir>
<dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">window.alert("窗口对象输入方法")
</font></span></p>
</dir>
</dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">可直接使用以下格式:</font></span><dir>
<dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">alert("窗口对象输入方法")</font></span></p>
<p> </p>
</dir>
</dir>
</dir>
</dir>
</dir>
</dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>2、窗口对象的事件驱动</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 窗口对象主要有装入Web文档事件onload和卸载时onunload事件。用于文档载入和停止载入时开始和停止更新文档。</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>3、窗口对象的方法</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 窗口对象的方法主要用来提供信息或输入数据以及创建一个新的窗口。</font></span><dir>
<dir>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 创建一个新窗口open()</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">使用window.open(参数表)方法可以创建一个新的窗口。其中参数表提供有窗口的主要特性和文档及窗口的命名。</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 具有OK按钮的对话框</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">alert()方法能创建一个具有OK按钮的对话框。</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 具有OK和Cancel按钮的对话框</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">confirm()方法为编程人员提供一个具有两个按钮的对话框。</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 具有输入信息的对话框</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">prompt()方法允许用户在对话框中输入信息,并可使用默认值,其基本格式如下prompt(“提示信息”,默认值)。</font></span></p>
<p> </p>
</dir>
</dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>4、窗口对象中的属性</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 窗口对象中的属性主要用来对浏览器中存在的各种窗口和框架的引用,其主要属性有以下几个:</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(1)frames
确文档中帧的数目</font></span><dir>
<dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">frames(帧)作为实现一个窗口的分隔操作,起到非常有用的作用,在使用注意以下几点:</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> frames属性是通过HTML标识<Frames>的顺序来引用的,它包含了一个窗口中的全部帧数。</font></span></p>
<p><img src="javascript/Bullet3.gif" tppabs="http://www.4gee.com/colleges/homepages/javascript/Bullet3.gif" width="12" height="12" alt="Bullet3.gif (148 字节)"><span
style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 帧本身已是一类窗口,继承了窗口对象所有的全部属性和方法。</font></span></p>
</dir>
</dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(2)Parent
指明当前窗口或帧的父窗口。</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(3)defaultstatus:默认状态,它的值显示在窗口的状态栏中。</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(4)status:包含文档窗口中帧中的当前信息。</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(5)top:包括的是用以实现所有的下级窗口的窗口。</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(6)window.指的是当前窗口</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">(7)self:引用当前窗口。</font></span></p>
<p> </p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>5、输出流及文档对象</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">在JavaScript文档对象中,提供了用于显示关闭、消除、打开HTML页面的输出流。</font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"><b>(1)创建新文档open()方法</b></font></span></p>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN"> 使用document.open()创建一个新的窗口或在指定的命令窗口内打开文档。由于窗口对象是所加载的父对象,因而我们在调用它的属性或方法时,不需要加入Window对象。例用Window.
Open()与Open()是一样的。<br>
打开一个窗口的基本格式:</font></span><dir>
<dir>
<dir>
<dir>
<dir>
<dir>
<p><span style="color: rgb(125,125,125)" class="text"><font lang="ZH-CN">Window
.open("URL","窗口名字","窗口属性"]</font></span></p>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -