VBScript与动态网页编程.ppt

《VBScript与动态网页编程.ppt》由会员分享，可在线阅读，更多相关《VBScript与动态网页编程.ppt（71页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、第四章第四章VBScript与动态与动态网页编程网页编程4.1.VBScript对象编程对象编程4.1.1对象的属性、事件和方法对象的属性、事件和方法对象的概念对象的概念VBScript支持脚本对象（支持脚本对象（Windows对象、对象、Document对象、对象、Forms对象等）和对象等）和DHTML内部控件（内部控件（Button控件、控件、Text控件等）控件等）对象的属性对象的属性对象名对象名.属性名属性名=属性值属性值对象的事件对象的事件对象的方法对象的方法对象名对象名.方法名方法名参数参数1，参数，参数24.1.2事件驱动程序设计事件驱动程序设计VBScript是一种基于事件驱

2、动的编程语言，它可以对在浏览器中发生的很多事件做出响应。1.事件驱动模型机制事件驱动模型机制事件驱动意味着系统中各个部分之间事件驱动意味着系统中各个部分之间以及系统与应用程序之间通过以及系统与应用程序之间通过“消息消息”进进行通信，消息的发送与接收伴随着事件的行通信，消息的发送与接收伴随着事件的发生，不同的消息与不同的事件相联系。发生，不同的消息与不同的事件相联系。应用程序通过与特定消息相对应的事件过应用程序通过与特定消息相对应的事件过程代码实现与用户的交互。程代码实现与用户的交互。VBScript代码是在浏览器中执行的，而浏览代码是在浏览器中执行的，而浏览器是器是Windows操作系统的一个

3、应用程序。操作系统的一个应用程序。Windows操作系统是基于事件驱动的，通操作系统是基于事件驱动的，通过消息机制，系统与应用程序进行通信，协调它过消息机制，系统与应用程序进行通信，协调它们的工作。当用户在浏览器中进行操作时（如单们的工作。当用户在浏览器中进行操作时（如单击鼠标左键或按下键盘上的某个键），操作系统击鼠标左键或按下键盘上的某个键），操作系统检测到该操作便向浏览器发送相应的消息，后者检测到该操作便向浏览器发送相应的消息，后者接收到消息后，就在当前接收到消息后，就在当前VBScript应用程序中应用程序中寻找对应的事件处理代码寻找对应的事件处理代码事件过程。如果该事件过程。如果该过程

4、存在，执行该段代码，否则就交由浏览器处过程存在，执行该段代码，否则就交由浏览器处理。理。在事件驱动的程序设计中，程序员根据需要设计在事件驱动的程序设计中，程序员根据需要设计事件处理代码事件处理代码事件过程，而无需确定这些过事件过程，而无需确定这些过程的执行顺序。当用户进行操作时，程序将执行程的执行顺序。当用户进行操作时，程序将执行相应的事件过程。这些事件的发生是随机的，依相应的事件过程。这些事件的发生是随机的，依赖于用户的实际操作。赖于用户的实际操作。需要注意的是，不必为所有的事件编写事件过需要注意的是，不必为所有的事件编写事件过程。例如在处理鼠标单击事件时，一般只需为对程。例如在处理鼠标单击

5、事件时，一般只需为对象的象的Click事件编写代码，而不必为事件编写代码，而不必为MouseDown和和MouseUp事件编写代码。事件编写代码。2.事件过程的调用方式事件过程的调用方式事件过程按其名称被识别，事件过程的命名规则是：事件过程按其名称被识别，事件过程的命名规则是：on事件名，如事件名，如Click事件过程名为事件过程名为onclick。事件过程。事件过程的定义与调用有如下的定义与调用有如下4种方式。种方式。(1)通过通过标记块实现标记块实现为每个事件过程分配一个为每个事件过程分配一个标记块，然标记块，然后使用后使用标记的标记的event属性调用事件过程，属性调用事件过程，其语法格

6、式为：其语法格式为：事件过程代码事件过程代码说明：此方式在第说明：此方式在第3章中已多次使用。章中已多次使用。2)在对象定义标记中设置事件过程在对象定义标记中设置事件过程通过在对象定义标记中设置事件过程可通过在对象定义标记中设置事件过程可以直接调用事件过程代码，如下面代码：以直接调用事件过程代码，如下面代码：调用事件过程调用事件过程调用事件过程调用事件过程图4-1调用事件过程(4)单独定义事件过程这种方式对事件过程的命名有严格的要求，过程名必须是：对象名_on事件名通常在脚本的块中定义事件过程，如上述代码可以改为：调用事件过程Submybtn_onclickaa=这是按钮的单击事件msgbox

7、aaEndSub调用事件过程代码在浏览器中的执行如图4-1所示。(3)在对象定义标记中调用事件过程在对象定义标记中设置事件过程属性可以调用命名Sub过程。上述代码可以改为：调用事件过程Submysub()aa=这是按钮的单击事件msgboxaaEndSub调用事件过程代码在浏览器中的执行如图4-1所示。4.2DHTML对象模型简介4.2.1Window对象Window对象表示浏览器中一个打开的窗口。通过引用该对象的属性可以控制脚本中其他对象的属性，进而控制整个网页的外观以及对事件的响应。可以使用Window对象获得当前窗口的状态信息、文档信息、浏览器信息，还可以通过该对象响应发生在浏览器中的事

8、件。一般地，浏览器在打开一个HTML文档时，创建一个Window对象。如果文档中定义了多个Frames对象，则在文档中有多个Frame标记。在这种情况下，浏览器为该文档创建一个父Window对象，为每个Frame标记创建一个子Window对象。父Window对象中发生的操作可以影响子Window对象。如调用父Window对象的Close方法将不只关闭父窗口，所有的子窗口都会关闭。在脚本程序中使用Window对象的属性、方法、集合时，一般不必标明Window，而直接使用。比如，关闭窗口时，可以用代码Close，而不必写为：Window.Close。只是为了增加程序的可读性，建议用户标明Windo

9、w对象。1.Window对象的属性对象的属性Window对象有多个属性，通过这些属性可对象有多个属性，通过这些属性可以得到客户端浏览器属性，可以控制当前窗口的以得到客户端浏览器属性，可以控制当前窗口的HTML文档等等。文档等等。说明：使用Parent属性可以引用父窗口的名称，如果页面由几个Frame对象组成，在一个Frame中调用其他Frame中的对象时，必须得到父窗口对象后，将其作为集合才能访问其他的Frame。使用Self属性就可以显式地引用当前Window对象或者Frame对象的方法，从而避免因表单与Window对象重名引起的歧义，提高脚本代码的可读性。使用Status属性可以引用当前页

10、面的状态栏，例如用如下代码在浏览器状态栏中提示用户正在加载网页：Window.status=正在加载网页把上述代码放在load事件过程中，就能够使用户看见提示信息。使用event属性时必须标明Window对象：Window.event。使用event属性可以返回对Event对象的引用，Event对象的属性有：button、altKey、ctrlKey、shiftKey、toElement、fromElement、returnValue、keyCode等等，用于返回该事件发生时相应对象的状态、鼠标和键盘的状态（比如，键盘上哪个键按下了，鼠标的位置以及鼠标左键是否按下）。但要注意，在特定的事件过程

11、中，不是所有的属性都有意义。例如，Event的fromElement和toElement属性只在mouseover和mouseout事件处理过程中才有意义。2.Window对象的方法Window对象的方法用于显示提示信息、输入信息、控制HTML页面外观、触发和响应事件、显示HTML页面等。说明：Alert方法用于显示一个对话框，有些类似于MsgBox函数产生的对话框，只是Alert产生的对话框含有图标，而且对话框标题为“MicrosoftInternetExplorer”。注意，无法更改使用该方法产生的对话框标题。Confirm方法与Alert产生的对话框不同，该方法产生的对话框有两个按钮，而

12、且有返回值。单击“确定”按钮，该方法返回值为True；单击“取消”按钮，该方法返回值为False。注意，无法更改使用该方法产生的对话框标题。Prompt方法产生一个输入对话框，其语法如下：Prompt(message,inputDefault)其中，message是可选参数，是显示提示信息的字符串；InputDefault也是可选参数，显示缺省输入值。如果不指定InputDefault参数，那么，对话框的输入框中将显示“undefined”字样。该方法的返回值为用户输入的字符串。与Alert、Confirm一样，该方法产生的对话框标题无法更改。SetTimeout方法的语法如下：SetTime

13、out(命令或过程,毫秒数)其作用是在指定的时间（毫秒数）后执行指定的“命令或过程”。open方法的语法如下：window=对象名.open(URL,name,features,replace)其中，URL参数指定了新窗口要加载的HTML文档。如果不指定URL参数，则加载一个空HTML文档。name参数是可选的，用来指定新窗口的名称，以便别的HTML文档通过超链接调用。Features参数是可选的，用于指定新窗口的样式，有多个选项可以选择，各选项取值与说明见表4-3。replace参数也是可选的，可以设置为yes或者no，用于指定加载的URL在浏览器历史记录中，是否替换原窗口的URL记录。例如

14、，可以用如下代码打开一个窗口：Window.Opentitile.htm下述代码打开一个名为title.htm的文档，新窗口不指定名称，显示工具栏，显示“链接”工具栏：Window.Opentitile.htm,null,fullscreen=no,toolbar=yes,directories=yesNavigate方法用于改变当前页面的URL，使页面转向新的URL，其作用相当于改变Location对象的href属性值。例如，可以用如下代码指定当前页面的URL：Window.Navigatehttp:/3.Window对象的事件Window对象的事件分为：与加载或卸载网页有关的、与窗口状态对

15、象的事件分为：与加载或卸载网页有关的、与窗口状态有关的，与窗口中事件处理有关的。这些事件中常用的有有关的，与窗口中事件处理有关的。这些事件中常用的有Load、Unload、Resize。Load事件与事件与Unload事件分别发生于网页的加载或卸载时，它们事件分别发生于网页的加载或卸载时，它们界定了一个界定了一个HTML文档的生命期。文档的生命期。Load事件在事件在IE加载给定对象后立刻发生。该事件过程应在加载给定对象后立刻发生。该事件过程应在标记中声明。在网页的标记中声明。在网页的Load事件处理函数中可以对网页做事件处理函数中可以对网页做一些初始化工作，或者显示一些信息。例如，下面的代码

16、可以在加载一些初始化工作，或者显示一些信息。例如，下面的代码可以在加载网页时显示对话框说明已经触发了网页时显示对话框说明已经触发了Load事件。事件。Load事件过程事件过程Subinit()MsgBox正在加载网页，触发了正在加载网页，触发了Load事件事件EndSubUnload事件是在IE关闭该网页时触发。可以在该事件过程中添加代码，保存有用的用户信息。比如，在进行网上购物时，可以在网页的Unload事件过程中，统计购物的种类和数目等等。下面的代码可以在关闭网页时显示对话框说明已经触发了Unload事件。unLoad事件过程SubLeaving()MsgBox正在离开网页，触发了Unlo

17、ad事件EndSubResize事件发生在用户调整浏览器窗口大小时，可以在其事件过程中重新安排页面中各要素的显示位置和尺寸，以便增加网页对用户操作的敏感性，使交互界面更友好。4.2.2Document对象Document对象代表了当前浏览器窗口中的HTML文档，它是脚本对象模型中最为重要的对象。可以通过该对象检测HTML文档中各元素的状态（比如，颜色、字体，发生的事件等），并且可以更改这些元素的状态。在HTML文档的任何位置都可以调用该对象。1.Document对象的属性说明：上述属性的颜色可以使用IE颜色表中的值。对颜色值的调用既可以通过颜色名，又可以通过相应的十六进制数。cookie是由浏

18、览器读取或写入硬盘的文本文件，存放在特定的文件夹中。cookie可以存放用户名和选项等配置信息，使得下一次请求同一页面时，脚本能找到上次存放在客户机上的数据，以调整用户配置。通常用cookie来保存服务器发送来的字符串，以便在页面之间共享信息。在VBScript中，可以使用如下代码把该属性值设为指定值，然后显示出来：document.cookie=color=YellowMsgBox(document.cookie)link属性返回当前页面所有超链接的集合，其元素个数为document.link.length。通过这个集合可以很方便地访问页面中的所有超链接。2.Document对象的方法Doc

19、ument对象提供了多种方法控制网页的读写以及外观，常用的方法见表4-5。说明：与window对象的Open方法不同，Document对象的open方法只是在当前浏览器窗口新建一个HTML文档，前者则新建一个浏览器窗口。在动态更改网页操作中，一般先调用open方法在浏览器窗口中打开一个空的文档，然后，通过调用write或者writeln方法在文档中输入新的内容，然后，调用close方法关闭文档并显示它。write方法和writeln方法的区别在于writeln方法在输出字符串末尾添加了回车标志，当然回车标志只在标记和内部起作用。3.Document对象的事件常用的Document对象事件有：c

20、lick，dblclick、keydown、keypress、keyup、mousedown、mouseover、mouseout、mouseup等。对于鼠标事件的响应与前面介绍的基本致。不同HTML元素对该事件过程的调用形式不同，在文档中与Document对象相对应的HTML标记是，所以，调用Document对象的事件过程时要在标记中添加代码。4.2.3History对象History对象包含了用户访问过的URL信息，通过这些信息可以使浏览器具有导航功能，使得用户可以很方便地在感兴趣的URL之间切换。History对象不出现在网页上，因而没有对应的事件，只有一些属性和方法。以下分别介绍His

21、tory对象常用的属性、方法。1.History对象的属性History对象只有一个Length属性。该属性返回用户访问过的URL个数。该属性只读，在程序中不能对它进行赋值操作，使用频率并不高。2.History对象的方法History对象的方法用于在URL历史记录中移动，从而改变当前URL。它有三个方法，back方法，forward方法和go方法。（1）back方法。该方法用于回溯浏览内容，等效于用户在浏览器中单击n次“后退”按钮。其调用形式如下：History.backn其中，参数n指定在URL历史记录中回溯URL的个数。例如：window.history.back1该语句使得当前文档切换

22、到最近一次访问过的URL。（2）forward方法。该方法用于显示URL历史记录表中下一个URL的内容，等效于用户在浏览器中单击n次“前进”按钮。其调用形式如下：History.forwardn其中，参数n指定在URL历史记录表中向前移动URL的个数。（3）go方法。该方法用于显示URL历史记录表中特定URL的内容。其调用形式如下：History.go(delta|location)其中，参数delta是个整数，指定了目标URL的相对位置。参数location是个字符串，指定了目标URL的一部分或者全部。说明：当参数delta为1时，相当于执行语句：History.forward1。当参数de

23、lta为-1时，相当于执行语句：History.back1。4.2.4Navigator对象Navigator对象包含了客户端浏览器的信息，通过引用该对象的属性可以得到这些信息，在大多数情况下，客户端使用的浏览器类型是无法事先知道的。这就要求HTML文档能够适应多种浏览器的特性，比如可能需要它同时适用于IE和Netscape浏览器。而事实上，浏览器之间的兼容性并不好。为此，我们可以设计两组页面，每组页面对应一种浏览器，由脚本程序判断页面是由哪种浏览器打开的，然后根据浏览器的信息打开相应的页面，以便用户获得最佳的浏览效果。Navigator对象不出现在网页上，因而没有对应的事件，只有一些属性和方

24、法。1.Navigator对象的属性Navigator对象的属性包含了浏览器的名称、版本、设置等。其中，较为常用的属性有appCodeName、appName，appVersion、cookieEnabled等。appCodeName属性。通过该属性可以得到浏览器类型代号。例如，对于IE来说，该属性的返回值为“Mozilla”。appName属性。通过该属性可以得到浏览器类型名称。例如，对于IE来说，该属性的返回值为“MicrosoftInternetExplorer”。appVersion属性。通过该属性可以得到浏览器的版本号。cookieEnabled属性。由于cookie可以存放一些有用

25、的用户信息，所以，判断浏览器是否支持cookie很有用处。2.Navigator对象的方法Navigator对象支持两个方法：javaEnabled和taintEnabled。其中，前者可以用来确定浏览器是否支持java编程语言。这样，脚本程序可以利用这条信息动态调整代码。对于不支持java的，程序中原来用java的部分，可以用VBScript代码实现。后者可以用来确定浏览器是否支持数据tainting。例如，可以用如下代码指定当前窗口的URL：Window.Location.href=http:/href属性是Location对象的缺省属性。也就是说，下属代码等价：Location=./chap3/docExample.htmLocation.href=./chap3/docExample.htmpathname属性。该属性可用来设置当前文档的路径，通过它能够调用Web根目录以外的文档。search属性。该属性用来返回URL中嵌入的参数，通过参数来实现网页间的信息交互。这种方式比起使用服务器端对象要简单一些。在URL中嵌入参数的方法是在URL后面加一个问号(?)，然后紧跟参数名称和参数值。例如：http:/www.SomeS