13 高级网页设计技术
13．1 嵌入HTML标记
为了能够在网页中插（嵌）入FrontPage 2000无法理解（看“懂”）HTML代码，FrontPage
2000提供了嵌入HTML的功能。
注意：使用（插）嵌入HTML标记与普通插入HTML代码的本质区别是：FrontPage
2000不检查用前者方式插入的HTML代码的正确性。
13．2 使用Java小程序（Top）
13．2．1 Java概述（Top）
Java编程语言最初是作为消费电器的编程语言来设计和实现的。然而，在SUN Microsystems公司的赞助下，它已经开发成为一个通用目的的、高水平的编程语言了，就像C＋＋一样，Java不是专门面向Web编程的，单机Java程序不需要在网页中运行。
Java小程序是整个Java开发环境的特殊的子集。
Java在Web编程中应用的最见形式是Java小程序。它们是设计在网页中执行的专门的Java程序。要运行一个Java小程序，需要一个启用Java的Web浏览器。这些浏览器能够下载在网页中指定的Java程序，然后通过使用和浏览器软件一致的Java虚拟机在用户的计算机上执行这些程序。
在Web中，Java小程序提供下列好处：
因为它们在客房而不是在服务器上运行，所以Java小程序可能更好地利用计算机资源。
13．2．2 应用Java小程序（Top）
通过Java编译器，能将Java源程序编译成以．class结尾的字节码文件，从而创建Java小应用程序和独立应用程序。在Web页面中应用Java小程序，使用HTML语言中的＜APPLET＞来标识，且其在Web页面被下载时一起被下载下来执行。一个小应用程序可以在Web页面上占据你给它预留的某些空间，并且能够在此空间上给用户显示图形和文本。
注意：微软也提供Java小程序。例如，第10章介绍过的：横幅广告管理器和悬停按钮。
例，Java小程序－即时时钟
Sun公司的网站上，供下载的文件：http://java.sun.com/openstudio/demo.zip之中，就有即时时钟，Java小程序。
将demo.zip解压后，即可把即时时钟插入网页。
除了课本P227所说的方法（烦琐）外。另一种插入方法是：
⑴单击“插入”·“文件”后，在“选择文件”对话框中，选择包含即时时钟的网页文件，然后单击“打开”。
⑵在Java小程序图标上单击右键，然后单击“Java小程序属性”。
⑶“Java小程序属性”对话框上
“Java小程序源”框，键入程序名
“含有Java小程序的URL”框，键入存放有关.Class扩展名文件的目录
“浏览器不支持Java时显示的消息”框，目前一般浏览器均支持。因此，可以不填
“Java小程序参数”框，列出了用户可以修改的参数。若要修改、添加、删除，分别单击右侧的相应按钮。框中所列即时时钟的参数的含义见下表。
| 名 称 |
值 |
含 义 |
| border |
2 |
钟圆周边界宽度 |
| nradius |
78 |
数字半径 |
| cfont |
TimesRoman|BOLD|16 |
字体、字型、字号 |
| delay |
100 |
秒针跳动时间间隔 |
| bgcolor |
ffffff |
圆周外方框内颜色 |
| shcolor |
ff0000 |
秒针颜色 |
| mhcolor |
00ff00 |
分针颜色 |
| hhcolor |
0000ff |
时针颜色 |
| ccolor |
eeeeee |
钟面颜色 |
| ncolor |
000000 |
数字和圆周边框颜色 |
“布局”选项区，指定与周边网页元素的间距及对齐方式。
“大小”选项区，指定即时时钟的大小。
注意：对话框上设置，也可在“网页”·“HTML”视图直接修改。
13．3 运用视频（Top）
13．3．1 嵌入视频（Top）
嵌入视频，使用了插件技术，将视频播放器和视频文件一起插入网页，由浏览者自行播放视频文件。
嵌入视频的方法
⑴将光标移至需嵌入视频处后，单击“插入”·“高级”·“插件”。
⑵在“插件属性”对话框上：
“数据源”框，输入视频文件路径及文件名；
“浏览器不支持插件时显示的消息”框，输入当浏览器不支持视频播放器（插件）时，显示给浏览者的信息。可以空白。
“大小”选项区，以像素为度量单位，设定视频图像的“高度”和“宽度”。
“隐藏插件”复选框，选中，则在浏览器中不显示。
“布局”选项区（一般用默认设置），设置视频在网页中的能者为师方式、视频与周围的网页元素之间的水平、垂直距离，以及视频图像的边框粗细等。
⑶设置完成后，单击“确定”。
注意：在“插件属性”对话框的数据源中，可以中多种格式的文件。例如，avi是视频、swf是Flash播放格式。
13．3．2 插入视频（Top）
与嵌入视频不同的是，插入视频，视频播放器不交给浏览者，插入的视频文件的播放方式、次数等，由网页制作者设定。
插入视频的方法
⑴将光标移至需插入视频处后，单击“插入”·“图片”·“视频”。
⑵在“视频”对话框的“URL”框中输入视频文件的地址。单击“确定”。
插入视频属性的设置方法
插入视频属性设置，主要在“图片属性”对话框的“视频”选项卡上进行。
“视频源”框，视频文件的URL地址。
“重复”选项区，设定“循环次数”和“循环延迟”（两次播放之间的间歇）。
“播放”选项区，设定触发播放的事件。有，“打开文件时”和“当鼠标悬停于其上时”两种。
注意：视频的大小，在“外观”选项卡上设定。
13．3．3 链接视频（Top）
链接视频是将视频文件作为超级链接的目标。
链接视频的播放方式与嵌入视频的相同。区别在于，视频文件不保存在本网站中。
注意：链接的视频文件在本地磁盘上，就不会出现图13－12所示的对话框。
13．4 使用音频（Top）
音频文件格式很多，常用的是：WAV、MIDI和MP3。
WAV文件，音色好，但文件大。
MIDI文件，音色较差，但文件较小。
MP3文件，压缩比大，音色较好，但需要专门的MP3播放器。
13．4．1 嵌入音频（Top）
嵌入音频，与嵌入视频一样，使用了插件技术，将音频播放器和视频文件一起插入网页，由浏览者自行播放音频文件。
嵌入音频的方法与嵌入视频方法相似。
13．4．2 背景音乐（Top）
背景音乐与嵌入音频的区别，仅仅是“隐藏插件”（在“插件属性”对话框上，选中“隐藏插件”复选框）。
13．4．3 插入音频（Top）
嵌入音频，需要相应的插件。插入音频，则不需要插件技术。
插入音频的方法
在“网页”·“普通”视图中打开需要插入音频的网页后，单击“文件”·“属性”（或在窗口中单击右键，然后单击“网页属性”），打开“网页属性”对话框。
“常规”选项卡的“背景音乐”选项区
“位置”框，输入音频文件的URL地址。
“不限次数”复选框，默认选中，只要该网页打开，无限次循环播放音乐。若在限定播放次数，则先取消该得利选框，然后在“循环次数”数值框中设定次数。
13．4．4 链接音频（Top）
与链接视频相似。
13．5 使用ActiveX控件（Top）
ActiveX控件是由Microsoft公司的OEL（Object Linking Embeding）技术发展的。
ActiveX技术是Microsoft公司为适应网络环境，扩展OEL技术功能，推出的用于组件对象模型（COM）的一种技术，它可使各种软件组件在网络环境中互相使用，且不管该组件是用体积语言编写的。
目前，ActiveX控件广泛地使用在当前许多流行的编程语言环境中，如，网页制作、C＋＋等。
ActiveX控件是给你的网页添加功能的软件组件。它所添加的功能是你用标准的HTML代码无法实现的。
ActiveX控件的例子有：能够以不同大小和角度显示文本的标签控件；能够产生定时事件的定时器控件；显示股票信息的股票行情控件；以及能够显示动画的动画控件等等。可以用很多种编程语言创建ActiveX控件，包括Visual C＋＋和 Visual Basic。注意，一些浏览器不能识别网页上的ActiveX控件。关于ActiveX和ActiveX控件的更多信息以及怎样下载 ActiveX控件的信息，清查看 World Wide Web上的 Microsoft ActiveX站点：
www.microsoft.com/activex
ActiveX技术是微软于1996年引入的。由于ActiveX控件没有成为微软所希望的动态内容和网页数据访问标准，而脚本和DHTML将提供这种能力。为了有利于和DHTML相关的工具，微软似乎正在减少对ActiveX的投入。
13．5．1 插入ActiveX控件（Top）
添加和使用ActiveX控件的方法
在“网页”·“普通”视图中，将光标移至需要 插入ActiveX控件处，单击“插入”·“高级”·“ActiveX控件”。
在“插入ActiveX控件”对话框的“选择控件”框中，显示该微机上已经安装的ActiveX控件列表。
在其中选定所需的ActiveX控件后，单击“确定”即可。
若“选择控件”框中没有，可单击“自定义”按钮，添加一个自定义控件。
13．5．2 设置ActiveX控件（Top）
每个ActiveX控件都有一个相关的属性对话框，这些对话框随你使用的控件的不同而不同。欲查看你的网页上的任意一个ActiveX控件的属性对话框，用鼠标有键单击这个控件，然后从弹出菜单中选择ActiveX控件属性命令。
每个ActiveX控件的属性都是特定的，需参照控件所附的文档来设置其属性。
13．6 动态网页（Top）
13．6．1 DHTML概述（Top）
DHTML，就是动态HTML语言，除了具备HTML语言的一切性质外，其最大的突破就是使人们在下载的Web页面上能够看到五彩缤纷的动态效果。
DHTML，并不是一种独立的语言，而是由HTML、CSS和脚本语言等三部分组成的。除了具备传统HTML的所有功能外，DHTML增加了动画、多媒体以及动态交叉互动功能。目前同DHTML，已经成为万维网上最强大的Web页面开发语言。
用HTML，指定Web页面元素，如标题、段落和表格等；
用层样式表（CSS），确定浏览器如何显示Web页面元素，如，大小、颜色、位置等；
用脚本语言，操作这些页面元素，真正使Web页面元素产生动态效果。
13．6．2 发展现状（Top）
微软公司和Netscape两家公司均推出了自己的DHTML。
主要差别在脚本语言这部分。
13．7 使用JavaScript与VBScript脚本语言（Top）
HTML语言本身不具备传统的编程能力。为弥补这一不足，推出了面向对象的Scripting（脚本）语言。
脚本语言编写的程序与其它语言编写的程序的区别是：它是直接由浏览器解释执行的（意味依赖于测览器），而不是先编释生成可执行文件。
13．7．1 JavaScript（Top）
JavaScript是由 Netscape公司开发，并随Netscape Navigator一起发布的，基于对象（Object Based）和事件驱动（Event Driver）的编程语言，它本身提供了非常丰富的内部对象，其前身是Netscape开发的脚本语言LiveScript。
1、JavaScript语言特点（Top）
JavaScript是一种解释执行的编程语言，主要用来实现网页上的一些用户交互功能。嵌入在HTML文本中的JavaScript源代码在发往客户端之前不需经过编译，而是以文本格式字符代码的形式传送到客户端的WWW浏览器，并由浏览器逐行解释执行。
JavaScript的出现，使得信息和用户之间不再只是一种显示和浏览的关系，而是实现了一种实时的、动态的、交互式的表达能力。它使得原先静态的HTML页面，被可提供动态、实时信息的Web页面所代替，这些页面可以对客户的输入操作作出反应，并动态地在客户端完成页面内容的更新。
JavaScript语言的出现和广泛使用，使得Web页面的内容变得更加生动，更富有生机，可以说JavaScript的是网络时代的产物。JavaScript脚本语言以它简单、方便的特点，深受广大网络用户的喜爱和欢迎，是众多脚本语言中较为优秀的一种。
JavaScript是一种基于对象和事件驱动，并具有安全性能的脚本语言。JavaScript语言与HTML超文本标记语言及Java小程序（Java Applet），一起实现Web页面中的多对象链结，并完成对Web客户交互操作的响应，从而实现客户端应用程序的开发。JavaScript脚本程序多嵌入在标准的HTML页面当中，但也可以通过调入操作来执行。JavaScript语言弥补了HTM语言自身的缺陷，是Java语言与HTML语言的一种折衷选择，它的基本特点包括以下几个方面：
A、脚本语言
JavaScript是一种脚本程序编写语言。像其他脚本语言一样，JavaScript也是一种解释性编程语言，它的开发过程比较简单。JavaScript语言的基本结构形式与 C、C＋＋、VB、Delphil十分类似。它们的不同在于，上述这些语言都是编译执行的，而JavaScript程序则是通过逐行解释来执行的。
B、基于对象的语言
面向对象的程序设计语言，试图把程序作为一些完成不同功能的独立部分（对象）的集合来处理，而不是将其视为完成特定任务的一系列语句。“类型”相近的对象被组合成类（例如：对象“苹果”就包含在“水果”类当中）。面向对象语言的关键在于，它允许用户创建类，但自身却不含有内置的类。
而基于对象的语言则不同：它本身含有许多内置的对象供用户直接调用。当然和面向对象的语言一样，基于对象的语言同样将程序视为完成不同功能的对象的集合。
JavaScript就是一种基于对象的语言，它本身内置了一些基本的对象。这样利用JavaScript语言编制的程序就可以直接使用这些对象来完成相应的功能，而不需要再由自己来创建这些类。例如：在JavaScript语言中不需要创建“date”类，因为语言本身中就包含了这个类。
C、基于事件驱动的语言（Top）
JavaScript是基于事件驱动的语言，当事件发生时，JavaScript就会作出反应，具体的反应方式由用户编程决定。所谓的“事件”，就是网页中执行的操作所产生的动作，例如：鼠标拖动、窗口移动、菜单选择等都是事件。JavaScript可以直接在客户端对用户输人做出响应，而无须经过Web服务程序，大大提高了响应速度，这也是JavaScript语言的优点之一。
D、良好的安全性
JavaScript是一种具有良好安全性的编程语言，它只能通过浏览器来实现信息的浏览和动态交互，而不允许访问用户硬盘或将数据保存到服务器上，同样它也不能从其他文件获取信息。这就意味着，不可能通过编写JavaScript程序来浏览某台计算机中的目录，同样也不能获取或删除用户文件。
但通过编写JavaScript程序监控浏览器的通话进程，来记录所访问的地址和用户的输入还是可能的（例如：通过脚本程序来获取用户在网页中提交的密码输入）。一般情况下，浏览器会提示用户所提交的信息可能会不安全，并要求用户加以确认。当然用户也可以通过浏览器中的选项来禁用JavaScript，这时网页中的JavaScript代码将被忽略。
E、跨平台性
JavaScript程序是平台无关的，它依赖于浏览器本身，而与操作系统无关。只要系统中运行的浏览器支持JavaScript语言，程序就可正确执行，这和一般常用的编程语言是不同的。但某些函数可能不是对所有的平台都可用的（例如：random（）方法）。
实际上，JavaScript最大的特点在于，它可以通过很少的程序代码来实现许多网页交互功能，而且不需要性能很高的电脑，编程所需要的软件也可以仅仅是个字处理软件即可，所以得到了越来越广泛的应用。
2、JavaScript和 Java的区别（Top）
JavaScript和Java间有着紧密的联系，但却是两个公司开发的不同的两个产品。Java是由SUN公司推出的新一代面向对象的多用途程序设计语言，其功能强大、高效，而且还具有一些独特的优点，所以一经推出就得到迅速发展，成为一门重要的Internet编程语言。而JavaScript是Netscape公司的产品，其目的是为了扩展 Netscape Navigator功能，而开发的一种可以嵌入Web页面中的基于对象和事件驱动的解释性语言。它的开发环境简单，不需要Java编译器，而是直接运行在Web浏览器中，而因深受Web设计者的喜爱。
下面来对这两种语言作个比较：
A、基于对象和面向对象（Top）
Java是一种真正的面向对象的程序设计语言，所有的程序都必须通过对象设计来实现。利用Java语言可以设计独立的应用程序或者是被称为Java小程序（Java Applets）的小型应用程序。
而JavaScript则是一种脚本语言，它可以用来制作与网络无关的，与用户进行交互的复杂软件。它是一种基于对象和事件驱动的编程语言，因此它本身提供了非常丰富的内部对象供程序设计人员选择使用。
B、解释和编译（Top）
Java和JavaScript两种编程语言在浏览器中的执行方式也不一样。
Java源程序在传递到客户端执行之前，必须经过编译，因此客户端上必须具有相应平台上的仿真器或编译器，这些仿真器或编译器使Java程序独立于操作系统平台。
而JavaScript是一种解释执行的编程语言，其程序代码不需经过编译，而是以文本格式的字符代码的形式发送给客户端的浏览器，并由浏览器中内置的解释程序解释执行。
C、强变量和弱变量（Top）
Java和JavaScript两种语言所采取的变量检查方式是不同的。
在Java语言中变量声明采用的是强类型变量检查方式，即程序中所采用的变量在编译之前都必须进行声明。例如：
Integer x；
String y；
x=6688；
y=“8866”；
其中变量x被定义为整型变量，而变量y则是个字符串变量。
而JavaScript中的变量声明，采用的则是弱类型检查方式，即变量在使用前不需作声明，而是由解释器在程序运行时检查其数据类型，例如：
x=6688；
y=“8866”；
前者说明天为数值型变量，而后者说明y为字符串型变量。
D、代码格式（Top）
Java语言与HTML无关，必须通过像引用外部媒体一样的方式来进行装载，其程序代码以字节代阴的形式保存在独立的文档中。
而JavaScript代码则是文本字符的形式，它可以直接嵌入HTML文档当中，并且可动态装载。
E、嵌入方式
在HTML文档中，两种编程语言的标识不同，JavaScript程序使用<Script>…</Script>标记来标识，而Java程序则使用<applet>…</applet>标记来标识。
F、静态联编和动态联编
Java语言采用的是静态链结的方式，即Java程序中的对象引用必须在编译时进行，以使编译器能够实现强类型检查。
而JavaScript采用动态链结的方式，即JavaScript的对象引用在程序运行时进行检查。
13．7．2 JavaScript例题（Top）
下面是一段JavaScript程序代码。作用是在状态栏上显示：敬告“将分辨率设为８００x６００以上，获得最佳效果！”
<script Language=“JavaScript”>
var msg = “敬告“将分辨率设为８００x６００以上，获得最佳效果！”” ;
var interval = 100
var spacelen = 120;
var space10=“ ”;
var seq=0;
function Scroll() {
len = msg.length;
window.status = msg.substring(0, seq+1);
seq++;
if ( seq >= len ) {
seq = 0;
window.status = '';
window.setTimeout(“Scroll();”, interval );
}
else
window.setTimeout(“Scroll();”, interval );
}
Scroll();
</script>
13．7．3 VBScript（Top）
1、VBScript简介
VBScript实际上是Microsoft Visual Basic的一个子集，是基于Visual Basic的脚本编写语言。这种脚本语言可用于创建客户方的脚本程序，并处理页面上的事件及生成动态内容。在DHTML中，正是因为脚本的出现，才使得网页变得生动起来；也正是将HTML、样式单及脚本结合起来，才使得HTML转变成为DHTML。
2、VBScript的特点
VBScript的最大优点在于简单易学，即使是一个对编程语言毫无经验的人也可以在短时间内掌握这种脚本语言。这是因为VBScript去掉了Visual Basic中使用的大多数关键字，而仅保留了其中少量的关键字，从而大大地简化了Visual Basic的语法，使得这种脚本语言更加易学易用。
除了简单易学外，VBScript还具有以下优点：
安全性好
由于VBScript是一种脚本语言而不是编程语言，所以也就没有编程语言所具有的读写文件和访问系统的功能，这就使得想利用该语言编写程序去侵入网络系统的人无从着手。通过这种办法，VBScript的安全性大为提高。
可移植性好
VBScript不仅支持Windows系统，同时也支持UNIX系统和Mac系统。这就使得VBScript的可移植性大为增强。
通过使用VBScript，HTML页面作者可以控制页面上的所有对象，并实现许多原本只有服务器方才能够处理的事件，从而极大地减轻了服务器方的负担。
此外，由于脚本是被直接嵌入到HTML文档中的，所以对脚本的加工和分发也就变得更为简单。
13．7．3 脚本编辑器（Top）
微软提供一个专门编辑脚本语言的脚本编辑器。
在FrontPage中调用方法
单击“工具”·“宏”·“Microsoft脚本编辑器”。
当Internet Explorer浏览器打开某个含有脚本语言的网页时，发现有错误时，也可启动该脚本编辑器，用来调试（修改）。
主页 （TOP）
| 