图表目录
图 1-1 南开大学网站主页面 .................................................................................................. 1 图 2-1 一个简单的HTML页面 .............................................................................................. 4 图 2-2 带FORM的HTML页面 ............................................................................................... 5 图 2-3 CSS示例 ........................................................................................................................ 5 图 2-4 使用XML标签的RSS ................................................................................................ 6 图 3-1 IE限制本机含客户端编码的HTML文件 .................................................................. 8 图 3-2 允许IE运行客户端编码.............................................................................................. 8 图 3-3 输入若干空格 ............................................................................................................... 9 图 3-4 提示结果 ..................................................................................................................... 10 图 3-5 输入项包括前后空格及合理字符 ............................................................................. 10 图 3-6 提示截去前后空格后的用户名 ................................................................................. 10 图 3-7 倒计时进行中 ............................................................................................................. 12 图 3-8 倒计时结束 ................................................................................................................. 12 图 3-9 弹出窗口的源文件 ..................................................................................................... 16 图 4-1 IIS配置：网站 ............................................................................................................ 20 图 4-2 IIS配置：主目录 ........................................................................................................ 21 图 4-3 IIS配置：目录安全性 ................................................................................................ 21 图 5-1 登录页面 ..................................................................................................................... 27 图 5-2 超级管理员页面 ......................................................................................................... 27 图 5-3 系统主界面 ................................................................................................................. 27 图 5-4 用户管理界面1 .......................................................................................................... 28 图 5-5 用户管理界面2 .......................................................................................................... 28 图 5-6 课程管理界面1 .......................................................................................................... 28 图 5-7 课程管理界面2 .......................................................................................................... 29 图 5-8 成绩管理界面1 .......................................................................................................... 29 图 5-9 成绩管理界面2 .......................................................................................................... 29 图 5-10 成绩显示 ................................................................................................................... 30 图 5-11 选课系统.................................................................................................................... 30 图 5-12 数据字典 ................................................................................................................... 31 图 5-13 IIS的SESSION超时设置 ........................................................................................... 36 图 5-14 浏览器的SESSION ..................................................................................................... 37 图 5-15 ODBC设置 ................................................................................................................ 39
1 概述
1.1 网站开发的主要内容
1.1.1 主要内容
当前网络应用中万维网因其图文并茂、简单易用而受到广泛欢迎，成为因特网使用最多的一项应用。而网站开发作为计算机软件开发领域的一个分支，作用也日益重要起来。
一般说来，网站开发的技术角色大概分为两类：一类负责页面设计，一类负责程序开发。页面设计主要负责网站页面的布局、装饰与美化，主要使用以下各类型软件：
? HTML编辑工具。如Microsoft FrontPage、Macromedia Dreamweaver等“所见即所得”式的集
成编辑工具。
? 图形图像编辑软件。典型的如Adobe Photoshop、Coral Draw、Cool 3D等二维、三维图形编辑
工具。
? 动画编辑工具。如Macromedia FlashMX可用于制作当前非常流行的Flash动画。
而负责程序开发的技术人员则主要进行网站相关程序的设计、编写、调试与实施等工作，通过编程实现网页动态内容。从程序运行的角度来分，又可分为客户端编程和服务器端编程两种。 下面以南开大学主页面为例来简单分析一下这两种角色的作用，请参看图 1-1。
图 1-1 南开大学网站主页面
该页面的布局（上下结构，下面又分成纵向的三个区域）、字体字号的选择、图片的制作等等，凡是属于页面装饰的内容，都归页面设计人员处理。一般正规软件公司里这种角色叫做“美工”，通常需要美术院校毕业。而页面左上方显示当前日期的地方，则明显是程序所为。让我们查看一下该页面
1
的源文件（IE菜单“查看”->“源文件”）。清单 1-1（实际文件无行号）是该源文件的一部分内容。 1.
2.
5. 28.
29.
清单 1-1 显示当前日期的JavaScript程序
以上可以看到显示当前日期的程序，这里使用的JavaScript的客户端编程，是需要程序开发人员负责的。
这两种角色在软件公司中通常是这样配合工作的：先由美工制作页面文件，制作完成后交客户征求意见，然后修改，直至客户满意。然后由程序开发人员在页面文件的相应部分添加程序代码，并进行调试。
1.1.2 本课程的主要内容
本课程偏重介绍程序开发部分，不介绍页面设计内容。因为页面设计需要一定的艺术修养，并需经过一定的训练才能胜任，而程序开发甚至不需要有计算机专业背景，普通人经过一定的学习、实践即可掌握。
当前能进行网站程序开发的技术有很多，不可能一一涉及。本课程客户端编程部分主要介绍JavaScript编程，服务器端编程重点介绍ASP开发技术，使用VBScript语言。这些虽然不是最新技术，但历经时间考验，是相当成熟、成本比较低、也是当前软件公司较多采用的开发技术。
1.2 网站开发的地位
计算机程序可分为单机程序和网络程序，前者指在单一计算机上运行的程序，不需联网环境。而后者要求运行该程序的计算机必须有网络支持，在运行过程中要从网络传输数据。目前网络程序主要是客户机/服务器结构（Client/Server，C/S），服务器指提供服务的计算机程序，客户机指连接服务器、使用其所提供的服务的程序。一般服务器只有一个，而使用该服务的客户机可以有多个。
2
1.2.1 客户机/服务器结构
C/S结构的网络程序数量庞大，覆盖多个领域，粗略说来，大概有如下几方面的内容： 网络应用：因特网的一些标准应用，如FTP等 即时通讯：Instant Message工具，如QQ、MSN等 网络游戏：如CS、传奇等
商务软件：很多企事业单位使用的管理工具，如ERP、CRM等 C/S结构的应用程序主要优点是可以实现数据、资源的共享（通过网络），而最大缺点则是程序开发维护上的困难。因为每台客户机都需要安装特制的客户端程序，每次升级都需所有客户机重新安装新版本，非常不便。
1.2.2 浏览器/服务器结构
浏览器/服务器结构（Browser/Server，B/S）是C/S结构的一个特例，以Web浏览器作为客户端，以Web服务器作为服务器端，由此避免了C/S客户端程序维护困难的缺点。Web浏览器主要使用Microsoft Internet Explorer、FireFox、Opera等当前流行的工具，服务器可选用Microsoft IIS、Apache等。程序开发人员可以在网页文件中编写代码，实现程序功能。
由于B/S结构更易实施与维护，已经逐渐成为网络应用程序的主要开发模式，尤其是很多原来使用C/S结构的商务软件，如财务软件、ERP等，近年来都有向B/S结构过渡的趋势。
1.2.3 管理信息系统
管理信息系统（Management Information System，MIS）是一大类型网络应用程序，主要针对企事业内部的大量信息、数据的处理，包括MRP、ERP、CRM、财务系统等等，用途广泛，而且大多数是商业系统。从技术上讲，这类系统涉及大量数据操作，需要小型、中型甚至大型数据库支持，数据库操作密集而频繁。目前这种系统大量采用B/S结构，主要使用服务器端编程手段。
1.3 本课程主要内容及学习方法
1.3.1 主要内容
本课程以MIS开发为主线，突出MIS开发的典型问题，重点讲解解决问题的思路。从技术上讲，MIS开发的技术手段有很多，本课程重点讲解其中一种技术（即JavaScript + ASP），以实例方式讲解。所有例子均出自教师在软件公司任职时的实际项目，加以简化，每个例子力求突出MIS开发中的某些典型问题，并详细介绍一种解决方法。
本课程不重语法细节，只着重解题思路。学生实际应用语法时可参考相关语法材料。学生最好系统学习过一门编程语言，会对本课程的学习有极大帮助。
1.3.2 学习方法
南开大学在校本科生，不论是否选修本课程，均可访问“教育在线”网站下载课程讲义、源码和参考资料，并可以提问、交流。
3
2 HTML
2.1 HTML
2.1.1 概述
HTML（HyperText Markup Language，超文本标记语言）是当前主流网络应用“万维网（World Wide Web，WWW）”的主要实现语言，是编写万维网页面文件的标记语言。我们学习网站开发，就是把程序代码插入到HTML代码中，所以必须对HTML有所了解。
HTML是一种标记语言，用于编写HTML文件，扩展名一般为html或htm，为纯文本文件，可用任何文本编辑器编辑，但只有使用Web浏览器打开才能显示标记的效果。该语言的规范由非营利组织World Wide Web Consortium（W3C， http://www.w3.org/）制定，当前语言版本是4.2。
2.1.2 语法
HTML的语法主要由标记（或称标签，Tag）和内容组成，其中标记一般由开始标签和结束标签构成，中间是内容，标记规定内容的显示方式。具体来说，HTML的标记不区分大小写（case-insensitive），标记不能交叉，标记可以包含进一步的参数。
图 2-1显示了一个简单的HTML源文件（右侧内容）及其在浏览器（IE）中的显示效果（左侧），藉此简单介绍一下HTML语法。
图 2-1 一个简单的HTML页面
源文件中在“<”和“>”之间的内容就叫“标记”，大多数标记是成对出现的，像第2行“”和第22行的“”，前者是开始标签，后者是结束标签（以“/”加上开始标签内出现的名称）。HTML页面文件应该以这个标记开始，表明这是一个HTML语言的文件。下面从第3行到第6行，“head”标签内都是页面文件的“头部”，主要是一些供浏览器参考的标记，如第4行的标签（该标签只有开始标签，没有结束标签）含义是该页面文件使用简体中文内码。第5行的“title”标签中间的内容“第一个HTML页面”则是要显示出来的内容，这段文字出现在浏览器的标题栏。 从第8行开始到第21行是“body”标签的“势力范围”，表示其中的内容要出现在浏览器的主要显示区域中。大家可对照源文件中的标签及在左侧浏览器中的实际显示效果看出不同标签的作用。 特别要提一下：HTML语法的注释写法如第10行的格式，可以有多行注释。另外对于没有规定的HTML标记，浏览器会简单地忽略其存在而不报错。如第15行的标签，就是HTML语言中没有被定义的，浏览器遇到这样的标签，不会显示任何错误，仅仅是将其忽略，标签中间的内容沿用前面的合法标签。
图 2-2是一个带表单（Form）的HTML文件及显示效果。
4