Web程序设计(第三版)_第1章web基础知识
合集下载
第1章 web程序设计基础
1.4.1CSS简介
应用样式表有三种方法：局部、内部和外部。内 部样式表和外部样式表合称为级联式样式。直接 将样式控制放在单个HTML元素内，称为局部样 式或行内样式；在head部分直接实现的CSS样式， 称为内部样式；在head部分通过导入以扩展名 为.css的文件来实现CSS样式，称为外部样式。 在这些方法中，可以只使用一种，也可以同时使 用这三种，一般说来局部样式将覆盖任何内部样 式，内部样式将覆盖外部样式，实际上，这就是 层叠样式表的由来。
1.3 XHTML标记及其属性
1．主体标记<body>…</body> 2.分层标记<div>…</div> 3.文本格式化设置标记 4. 表格标记 5. 图像标记<img /> 6. 超链接标记<a>…</a>
1.4 CSS基础
CSS(Cascading Style Sheets，中文译为层叠样式 表)是用于控制(增强)网页样式并允许将样式信息 与网页内容分离的一种标记性语言，现在已经为 大多数的浏览器所支持。它在字体、样式、风格 等方面的突出表现使其迅速在网页制作中流行起 来，成为网页设计必不可少的工具之一。利用 CSS样式，不仅可以控制一个网页文档中的文本 格式，而且通过引用外部样式表的方式还可以控 制多个网页文档中的文本格式。
1.6 概述
1.6.1 发展概述 1996年，Microsoft推出了ASP（Active Server Page）1.0版 1998年，微软发布了ASP 2.0和IIS 4.0。 之后，又推出了IIS 5.0和ASP 3.0。 2002年 1.0也应运而生 2003年，Microsoft公司发布了Visual Studio 2003（简称VS 2003） 2005年， 1.0升级为 2.0。 2008年， Visual 2008(简称VS 2008)
Web程序设计(第三版)第1章web基础知识
• 匿名FTP服务器 −用户无须拥有口令和用户名就能与匿名 FTP服务器实现连接并复制文件。
1.4 IP地址、域名和URL
1.4.1 IP地址 • IP地址是识别Internet中主机及网络设备的 唯一标识。 • 每个IP地址长度为4 B（字节），共32位 • 由两部分组成：
− 网络地址 − 主机地址
Internet的名称与定义
Internet的中文译名为因特网，也被称为国际互联网。 Internet的简单定义为：Internet就是由多个不同结构的网络， 通过统一的协议和网络设备（即TCP/IP协议和路由器等）互相连 接而成的、跨越国界的、世界范围的大型计算机互联网络。 Internet可以在全球范围内，提供电子邮件、WWW信息浏览与 查询、文件传输、电子新闻、多媒体通信等服务功能。 思考：计算机网络的定义？ 计算机网络就是将地理位臵不同的多台计算机，通过通信设备和 线路将其进行物理上的连接，并按照协议进行通信，实现网络资源 共享的系统。
浏览器/服务器结构(Browser/Server, B/S)
尝试分析这两种模式的优缺点？
图示C/S结构
客户端和服务器都是指通 信中所涉及的两个应用进 程（软件） 这里，服务器程序是运行 中的数据库管理系统
这里，客户端程序是实现 用户登录、浏览、查询特 定数据、连接数据库的程 序
互连网的域名管理机构将顶级域的管理权分派给指定的 管理机构，各管理机构对其管理的域继续进行划分，即划分 成二级域，并将二级域的管理权授予其下属的管理机构，依 此类推，便形成了树型域名结构。
1.4 IP地址、域名和URL
1.4.3 统一资源定位器URL
• 统一资源定位器URL（Uniform Resource Locator）是 用来确定某种信息位臵的方法. •其格式如下： <信息服务类型>：//<信息资源地址>/<文件路径>
1.4 IP地址、域名和URL
1.4.1 IP地址 • IP地址是识别Internet中主机及网络设备的 唯一标识。 • 每个IP地址长度为4 B（字节），共32位 • 由两部分组成：
− 网络地址 − 主机地址
Internet的名称与定义
Internet的中文译名为因特网，也被称为国际互联网。 Internet的简单定义为：Internet就是由多个不同结构的网络， 通过统一的协议和网络设备（即TCP/IP协议和路由器等）互相连 接而成的、跨越国界的、世界范围的大型计算机互联网络。 Internet可以在全球范围内，提供电子邮件、WWW信息浏览与 查询、文件传输、电子新闻、多媒体通信等服务功能。 思考：计算机网络的定义？ 计算机网络就是将地理位臵不同的多台计算机，通过通信设备和 线路将其进行物理上的连接，并按照协议进行通信，实现网络资源 共享的系统。
浏览器/服务器结构(Browser/Server, B/S)
尝试分析这两种模式的优缺点？
图示C/S结构
客户端和服务器都是指通 信中所涉及的两个应用进 程（软件） 这里，服务器程序是运行 中的数据库管理系统
这里，客户端程序是实现 用户登录、浏览、查询特 定数据、连接数据库的程 序
互连网的域名管理机构将顶级域的管理权分派给指定的 管理机构，各管理机构对其管理的域继续进行划分，即划分 成二级域，并将二级域的管理权授予其下属的管理机构，依 此类推，便形成了树型域名结构。
1.4 IP地址、域名和URL
1.4.3 统一资源定位器URL
• 统一资源定位器URL（Uniform Resource Locator）是 用来确定某种信息位臵的方法. •其格式如下： <信息服务类型>：//<信息资源地址>/<文件路径>
网页设计与制作实用教程(第3版) 第1章-网站开发基础
1.1.2 网站的类型及定位
2．电子商务网站 电子商务网站是目前最具发展潜力的网站类型。电 子商务网站提供网上交易和管理等全过程的服务， 因为它具有广告宣传、咨询洽谈、网上订购、网上 支付、电子账户、服务传递、意见征询、交易管理 等各种功能。
1.1.2 网站的类型及定位
3．视频分享网站 视频分享网站为用户提供视频播客、视频分享、视 频搜索及所有数字视频内容的存储和传输服务。可 供用户在线观看最新、最热的电视、电影和视频资 讯等。
1.1.3 认识网页
表单：访问者要查找一些信息或申请一些服务时需 要向网页提交一些信息，这些信息就是通过表单的 方式输入到Web服务器，并根据所设置的表单处 理程序进行加工处理的。表单中包括输入文本、单 选按钮、复选框和下拉菜单等。 超链接：超链接是实现网页按照一定逻辑关系进行 跳转的元素。 动态元素：动态元素包括GIF动画、Flash动画、 滚动字幕、悬停按钮、广告横幅、网站计数器等。
网页设计与制作实用教程（Dreamweaver+Flash+Photoshop（第3版））
第1章 网站开发基础
本章主要内容：
网站开发概述 网站开发流程 常用网页设计软件 HTML入门
1.1 网站开发概述
网站开发就是使用网页设计软件， 经过平面设计、网络动画设计、网页排 版等步骤，设计出多个页面。这些网页 通过一定逻辑关系的超链接，构成一个 网站。
1.1.2 网站的类型及定位
网站是一种新型媒体，在日常生活、商业活动、娱 乐游戏、新闻资讯等方面有着广泛的应用。在网站 开发之前，需要认识各种网站的主要功能和特点， 对网站进行定位。下面介绍几种常见的网站类型。
1.1.2 网站的类型及定位
1．综合门户网站 综合门户网站具有受众群体范围广泛，访问量高、信 息容量大等特点，包含时尚生活、时事新闻、运动娱 乐等众多栏目。综合门户网站定位明确，以文字链接 为主要内容、版式和色彩较为直观、简洁。
第01章 Web基础
7/19
分层是为了实现“高内聚、低耦合”。采用“分而治之”的思想，
把问题划分开来各个解决，这样易于控制，易于延展，易于分配资源。 (1)表示层：负责直接跟用户进行交互，一般也就是指系统的界面， 用于数据录入、数据显示等。 (2)业务逻辑层：用于做一些有效性验证 的工作，以更好地保证程序运行的健壮性， 例如完成数据添加、修改和查询业务；不允 许指定的文本框中输入空字符串，数据格式
4/19
1.1.3
C/S结构简介
C/S（Client/Server）结构即客户机和服务器结构。它是软件系 统的体系结构，通过它可以充分利用两端硬件环境的优势，将任务合 理分配到Client端和Server端来实现，降低了系统的通信开销。目前 许多应用软件正从Client/Server模式向分布式的Web应用发展。
14/19
（3）隔离驱动模式
用隔离驱动模式设计时，陈述层和数据层被独立地开发，常常是平行开发。 这两层在设计时没有任何的相互干扰，所以不会存在人为的约束和有害的设计元
素。当这两层都设计完成后，再设计业务层。业务层的责任就是在对数据层和陈
述层的需求没有发生变化的基础上完成所有的转换。 因为现在陈述层和数据层是完全独立的，当业务层需求改变的时候，陈述层 和数据层都可以做相应的修改而不影响对方。改变两个在物理上不相邻的层不会 直接对其他层产生影响或发生冲突，这就允许数据层进行结构的调整或者陈述层 根据用户的需求做相应的变化，而不需要系统做很大的调整或者修改。隔离驱动 模式如下所示。
ECMAScript标准。
3/19
1.1.2
B/S结构简介
B/S（Browser/Server）结构即浏览器和服务器结构，是WEB兴起后的
一种网络结构模式，WEB浏览器是客户端最主要的应用软件。 B/S最大的优点就是可以在任何地方进行操作而不用安装任何专门的 软件，只要有一台能上网的电脑就能使用，客户端零维护，系统的扩展非 常容易。
Web程序设计(第三版)_第1章
• HTTP (HyperText Transfer Protocol)协议实现 协议实现 浏览器和Web服务器的信息交换 浏览器和 服务器的信息交换
程序设计》 《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509 程序设计 第 版 ，电子工业出版社， ，
Web服务器 服务器
• 常见的客户端编程技术
– VBScript – JavaScript – Java applet等。 等
程序设计》 《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509 程序设计 第 版 ，电子工业出版社， ，
Web服务器端编程 服务器端编程
•服务器端编程 服务器端编程
程序设计》 《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509 程序设计 第 版 ，电子工业出版社， ，
1.3 Internet网络协议 网络协议
1.3.4 文件传输协议 文件传输协议FTP • FTP既是一种文件传输协议，也是一种服务。 既是一种文件传输协议， 既是一种文件传输协议 也是一种服务。 • 提供这种服务的设施叫做 提供这种服务的设施叫做FTP服务器。 服务器。 服务器 • 匿名 匿名FTP服务器 服务器 −用户无须拥有口令和用户名就能与匿名 用户无须拥有口令和用户名就能与匿名 FTP服务器实现连接并复制文件。 服务器实现连接并复制文件。 服务器实现连接并复制文件
程序设计》 《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509 程序设计 第 版 ，电子工业出版社， ，
1.2 Web的工作原理 的工作原理
• 浏览器 服务器 浏览器/服务器 服务器(Browser/Server，B/S)体系结构 ， 体系结构
第1章Web程序设计的基础知识精品PPT课件
• WWW服务的基础是Web页面，每个服务站点都包 括若干个相互关联的页面.
• 每个站点都有一个主页，是进入某个站点的起始页， 也就是第一页，相当于这个站点的窗口。
1.1 Internet及其提供 的服务
1.1.1 什么是Internet 1.1.2 Internet提供的服务
1.1 Internet及其提供的服务
1.1.1 什么是Internet Internet（中文译成因特网）是当今世界上最大的
计算机信息网络。
Internet是一个由多个网络互联组成的网络集合。
这种商务可以是零售、银行业、期货交易、咨
询或培训等等。
• 任何通过Internet进行产品或服务的出售 和买入的行为均属电子商务范畴。
• 由于当前电子商务依赖信用卡进行交易， 所以网络安全变得越发重要，而且网络安全技
术发展很快，主要用来对付那些不断发现新方 法侵入系统的黑客。
• 7. Internet电话
1.2 WWW的基本概念
• 1.2.1 概述 • 1.2.2 Web浏览器的工作原理 • 1.2.3 统一资源定位器URL • 1.2.4 超文本与超媒体 • 1.2.5 超文本标记语言HTML • 1.2.6 超文本传输协议 • 1.2.7 主页
• 1.2.1 概述
• Wide Web的英文缩写，译为“万维网”或“全球 信息网”.
要给Internet下一个严格的定义是非常困难的 。
Internet 的 实 用 性 主 要 在 于 它 的 信 息 资 源 ， Internet在全球范围内提供极为丰富的信息资源。
• 从网络通信技术的观点来看，Internet是 一个以TCP/IP通信协议为基础，连接各个 国家、各个部门、各个机构计算机网络的 数据通讯网；
• 每个站点都有一个主页，是进入某个站点的起始页， 也就是第一页，相当于这个站点的窗口。
1.1 Internet及其提供 的服务
1.1.1 什么是Internet 1.1.2 Internet提供的服务
1.1 Internet及其提供的服务
1.1.1 什么是Internet Internet（中文译成因特网）是当今世界上最大的
计算机信息网络。
Internet是一个由多个网络互联组成的网络集合。
这种商务可以是零售、银行业、期货交易、咨
询或培训等等。
• 任何通过Internet进行产品或服务的出售 和买入的行为均属电子商务范畴。
• 由于当前电子商务依赖信用卡进行交易， 所以网络安全变得越发重要，而且网络安全技
术发展很快，主要用来对付那些不断发现新方 法侵入系统的黑客。
• 7. Internet电话
1.2 WWW的基本概念
• 1.2.1 概述 • 1.2.2 Web浏览器的工作原理 • 1.2.3 统一资源定位器URL • 1.2.4 超文本与超媒体 • 1.2.5 超文本标记语言HTML • 1.2.6 超文本传输协议 • 1.2.7 主页
• 1.2.1 概述
• Wide Web的英文缩写，译为“万维网”或“全球 信息网”.
要给Internet下一个严格的定义是非常困难的 。
Internet 的 实 用 性 主 要 在 于 它 的 信 息 资 源 ， Internet在全球范围内提供极为丰富的信息资源。
• 从网络通信技术的观点来看，Internet是 一个以TCP/IP通信协议为基础，连接各个 国家、各个部门、各个机构计算机网络的 数据通讯网；
Chap01_Web程序设计基础
（1）效率增强 – 采用编译后运行的方式 ，速度大大提高。 （2）顶级开发工具支持 – 可以在Visual 中开发，支持所见即所得、拖放控件 和自动部署等功能。 （3）程序结构清晰 – 将程序代码和HTML标记分开 （4）移植方便 – 可以向目标服务器直接复制组件，当需要更新时，重新复制一 个即可。
Internet
Web 服务器
HTTP请求消息
HTTP响应消息
1.2.3 http 和 https
• http:
– http 1.0
• 这是第一个在通讯中指定版本号的 HTTP 协议版本，至今仍被 广泛采用，特别是在代理服务器中。
– http 1பைடு நூலகம்1
• 当前版本。持久连接被默认采用，并能很好地配合代理服务器工作。
特点：脚本在服务器端运行，不受客户端浏览器限制； 无需编译就可以解释执行。
优点：简单易学、容易上手；
缺点：所有代码都是解释执行的，运行速度比HTML 慢；只能在Windows环境下使用，不能跨平台；代码 的结构性不好，导致代码不好理解。
4）
是.NET框架体系的一部分，它建立在公共语言运 行库上，可用于在服务器上生成功能强大的Web应用程序， 为Web站点创建动态的、交互的HTML页面。
HTTP的基本思想：客户端给服务器发送请求，服务器 向客户发送响应。HTTP事务有两种类型：请求和响应。
•一次HTTP操作称为一个事务，其工作过程可分为四步： 1. 首先客户机与服务器需要建立连接。只要单击某个超级链接，HTTP的工作 就开始了。
2. 建立连接后，客户机发送一个请求给服务器，请求方式的格式为：统一资源 标识符（URL）、协议版本号，后边是MIME信息包括请求修饰符、客户机信 息和可能的内容。
Internet
Web 服务器
HTTP请求消息
HTTP响应消息
1.2.3 http 和 https
• http:
– http 1.0
• 这是第一个在通讯中指定版本号的 HTTP 协议版本，至今仍被 广泛采用，特别是在代理服务器中。
– http 1பைடு நூலகம்1
• 当前版本。持久连接被默认采用，并能很好地配合代理服务器工作。
特点：脚本在服务器端运行，不受客户端浏览器限制； 无需编译就可以解释执行。
优点：简单易学、容易上手；
缺点：所有代码都是解释执行的，运行速度比HTML 慢；只能在Windows环境下使用，不能跨平台；代码 的结构性不好，导致代码不好理解。
4）
是.NET框架体系的一部分，它建立在公共语言运 行库上，可用于在服务器上生成功能强大的Web应用程序， 为Web站点创建动态的、交互的HTML页面。
HTTP的基本思想：客户端给服务器发送请求，服务器 向客户发送响应。HTTP事务有两种类型：请求和响应。
•一次HTTP操作称为一个事务，其工作过程可分为四步： 1. 首先客户机与服务器需要建立连接。只要单击某个超级链接，HTTP的工作 就开始了。
2. 建立连接后，客户机发送一个请求给服务器，请求方式的格式为：统一资源 标识符（URL）、协议版本号，后边是MIME信息包括请求修饰符、客户机信 息和可能的内容。
《Web基础知识》PPT课件
整理ppt
4
Internet采用超文本和超媒体的组合方式，将信息的链 接扩展至整个Internet上。Web就是一种超文本信息系 统，它使得文本不再固定在某一个位置，而是可以从 一个位置跳转到另外的位置，正是这种多链接性，才 把它称为Web。
从用户的观点来看，Web是由一个巨大的全球范围的 文档或Web页面集合组成的，Web页面通常简称为页 面。每个页面可包含指向全球任何地方的其他页面的 链接，通过单击一个链接，用户可以跟随这个链接， 到达它所指向的页面，这个过程可以无限地重复下去。
在bs模式中用户通过浏览器向分布在网络上的许多服务器发出请求服务器对浏览器的请求进行处理将用户所需信息返回到浏览器其余的工作如数据请求加工结果返回以及动态网页生成对数据库的访问和应用程序的执行等全部由web服务器完成
第1章 Web基础知识
整理ppt
1
本章要点
Object ive
Web的概述 Web浏览器和Web服务器 Web的工作原理 网页的基本元素 网站及网站开发技术
云计算
整理ppt
17
1.2 浏览器/服务器模式
Web浏览器结合多种Script语言(VBScript、JavaScript 等)和ActiveX技术，实现了原来需要复杂专用软件才 能实现的强大功能，在前端实现一部分事务逻辑，在 服务器上实现系统功能的核心部分，这样就简化了系 统的开发、维护和使用。
整理ppt
23
网站的体系结构示意图
整理ppt
24
网站的工作流程
客户端通过浏览器来显示数据并实现与服务器的交互。
在 服 务 器 端 由 Web 服 务 器 通 过 HTTP （ HTTP ， HyperText Transfer Protocol）协议与客户端的浏览器 交互，Web服务器和应用服务器也使用HTTP作为它 们之间的通信协议，而应用服务器与数据库服务器之 间采用标准的机制进行通信。
第1章Web基础知识
1.1.3 分组交换思想
❖分组交换技术是在传输线路质量不高、网 络技术手段还比较单一的情况下，产生的 一种信息交换技术。分组交换将传送的数 据划分为分组，然后通过在计算机和终端 之间发送分组实现计算机与计算机之间的 通信。
❖进行分组交换的通信网称为分组交换网。 从交换技术的发展历史看，数据交换经历 了电路交换、报文交换、分组交换和综合 业务数字交换的发展过程。
➢URL主要由三部分组成：协议类型、存放资源
的域名或主机IP地址和资源文件名
➢URL的基本结构为：协议类型：//主机域名或
IP地址(:端口号)/路径/文件名
26
URL
➢URL完整的语法格式为： ➢协议类型：//主机域名或IP地址(:端口号)/路径
/[;参数][?查询]#字符串
➢参数为可选项，可以指定特殊参数 ➢查询为可选项，可以用于给动态网页传递参数 ➢字符串用于指定网络资源中的片段
万维网
❖ 1989年Web诞生于欧洲原子能研究中心 （CERN，European Organization for Nuclear Research），CERN的物理学家Tim BernersLee提出了一个新的因特网协议，命名为Web， 其目的是为了使科学家们可以利用网络共享文 档。
❖1994年，著名的Netscape Navigator浏览器问世。 ❖ 2019年，由Mosaic衍生而来的IE浏览器诞生。
OSI/RM和TCP/IP
1.1.6 IP地址
❖IP 地址就是给每个连接在因特网上的主机 （或路由器）分配一个在全世界范围是唯 一的 32 位的标识符。 IP 地址现在由因特 网名字与号码指派公司ICANN (Internet Corporation for Assigned Names and Numbers)进行分配。
第1章Web基础知识(WEB程序设计)
1.1 应用程序架构及其发展
1.1.4 浏览器/服务器架构
为解决客户机/服务器架构的应用局限，浏览器/服务器 （browser/server，B/S）架构的应用程序成为更多人的选 择。浏览器/服务器架构是对客户机/服务器架构的改进。它 使用Internet上的标准协议（TCP/IP）作为客户机和服务器 的通信协议，可以使位于Internet上的任意位置的人都可以 访问服务器（例如移动办公）。服务器完成数据处理和数据 的存储，并将处理结果以网页的形式提供给客户端。客户端 的浏览器实现对数据的显示，客户端不需要单独编写应用程 序，应用程序系统的升级只需在服务器上进行。
二进制数表示的IP地址： 11001010 01110000 00000000 00100100 用“点分十进制”表示为： 202.112.0.36
ቤተ መጻሕፍቲ ባይዱ
1.2 Internet基础
3. 域名
由于数字描述的IP地址没有规律，难于记忆，所以，人 们用具有一定含义的字符来描述每台主机的地址，称为域名 （Domain name）。在Internet上由域名服务系统（DNS）负 责IP地址和域名之间的转换，用户可以等价使用IP地址和域 名。
Web简介
1.3.4 Web应用程序部署环境
⑸ 启动服务并测试
1.3
⑴ 基于网络的编程模式 ⑵ 以界面表现为主导 ⑶ 可以跨平台实现 ⑷ 容易入门和掌握 ⑸ 难以实现复杂的系统
Web简介
1.3.5 Web应用程序的特点
⑹ 性能受网络带宽的影响
1.4
WEB应用程序开发工具简介
Web应用程序设计可以使用文本编辑软件和 专门的开发工具。 1. 文本编辑软件
1.1 应用程序架构及其发展
Web程序设计(第三版)_第5章
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
5. 2 DHTML简介
【例5-1】一个DHTML简例。
<html><head><title>DHTML简例</title></head> <body> <span id=s1 onMouseOver="s1.style.color='red'" onMouseOut = “s1.style.color=‘black’”>这是使用了 DHTML的一个简例。 </span> </body> </html>
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
5. 2 DHTML简介
• “动态”的含义不仅指页面中加入了动画、影像或声 音，更重要的是指页面应具有交互性，可以控制页面内 容的变化。DHTML是一种通过各种技术的综合而得以 实现的概念。 • 客户端的页面动态特性主要是通过层叠样式表 （CSS）、脚本程序和HTML 4.0来实现的，这三者构 成了动态HTML（Dynamic HTML，DHTML）。 • 实际上，DHTML基于HTML语言，利用CSS扩展样式 进行编排，借助浏览器对象模型概念，用脚本程序对网 页进行动态控制。
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
第 5 章 页面设计
5.1 页面设计概述 5.2 DHTML简介 5.3 层叠样式表CSS 5.4 浏览器对象模型及应用 5.5 HTML DOM
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
5. 2 DHTML简介
【例5-1】一个DHTML简例。
<html><head><title>DHTML简例</title></head> <body> <span id=s1 onMouseOver="s1.style.color='red'" onMouseOut = “s1.style.color=‘black’”>这是使用了 DHTML的一个简例。 </span> </body> </html>
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
5. 2 DHTML简介
• “动态”的含义不仅指页面中加入了动画、影像或声 音，更重要的是指页面应具有交互性，可以控制页面内 容的变化。DHTML是一种通过各种技术的综合而得以 实现的概念。 • 客户端的页面动态特性主要是通过层叠样式表 （CSS）、脚本程序和HTML 4.0来实现的，这三者构 成了动态HTML（Dynamic HTML，DHTML）。 • 实际上，DHTML基于HTML语言，利用CSS扩展样式 进行编排，借助浏览器对象模型概念，用脚本程序对网 页进行动态控制。
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
第 5 章 页面设计
5.1 页面设计概述 5.2 DHTML简介 5.3 层叠样式表CSS 5.4 浏览器对象模型及应用 5.5 HTML DOM
《Web程序设计》(第3版)，电子工业出版社，2011，ISBN:9787121131509
1 Web基础
第1单元 Web基础《web程序设计》课程主要内容Internet简史WWW万维⽹HTTP协议TCP/IP协议B/S结构MIME类型Web标准1 Internet简史第1单元 Web基础Internet Internet，又可以称为因特⽹，或者国际互联⽹，是使⽤公⽤语⾔互相通信的计算机连接⽽成的全球⽹络。
⼀旦计算机连接到Internet的任何⼀个节点上，就意味着已经连⼊Internet⽹上了。
Internet⽬前的⽤户已经遍及全球，有超过⼏亿⼈在使⽤Internet，并且它的⽤户数还在以等⽐级数上升。
接收 -mail 如电影票、门票、-票等 网上购物因特网与我们的生活密不可分 并且!我们的生活带来了极大的便利!但因特网现在的辉煌也不是一蹴而就的，它也需要很多阶段的成长。
我们把它的发展过程大致分成 大阶段，即雏形阶段、发展阶段和商业化阶段。
雏形阶段1957前苏联发射了⼈类第⼀颗⼈造地球卫星。
作为响应，美国国防部组建了⾼级研究计划局（ARPA），开始将科学技术应⽤于军事领域。
1961年，美国⿇省理⼯学院⼀名博⼠发表了分组交换技术的论⽂，该技术演变为互联⽹络的标准通信⽅式。
ARPANET时间：1969年名称： ARPANET⽬的：在战争中保障通信联络经费来源：美国国防部⾼级研究计划局（Advance Research ProjectsAgency,ARPA）特点：当⽹络中的⼀部分被破坏时，其余⽹络部分会很快建⽴起新的联系。
缺点：访问范围狭窄时间：1985年命名： NSFNET⽬的：使⽤访问范围更⼴创始⼈：美国国家科学基⾦会（NSF）技术背景：TCP/IP的研制成功特点：连接美国的若⼲个超级计算中⼼、主要⼤学和研究机构，世界上第⼀个互联⽹产⽣，是⾛向Internet的真正起点。
计算机⽹络蓬勃发展，各种各样的计算机⽹络应运⽽⽣。
1989年，MILNET与NSFNET连接后，就开始采⽤Internet这个名称。
第一章 Web程序设计基础
3.5系统要求 1）.net 框架 2）visual web developer( 2008) 3) sql server 2005
1 网站的运行
静态网站执行过程
请求数据服务
返回请求的数据
客户机
服务器
1 网站的运行
动态网站执行过程（ 为例） 动态网站执行过程（以为例） 为例 1.申请网页 2.服务器接到申请，发现寻找aspx文件,在系统中寻找 3.将网页加载，处理 4.生成html形式,网页回传
解释工 作
请求服务 请求数据
数据管 理工作
返回服务
返回数据
客户机
Web服务器
数据库服务器B/S示意图具Fra bibliotek逻 辑处理 工作
1 网站的运行
交互技术简介 -CGI：Common Gateway Interface的简称，CGI是一种通用的网关接口， 是外部程序和WEB服务器之间的标准编程接口。 -ASP：可以认为ASP是一种类似HTML、Script与CGI的结合体，但是 其运行效率却要比CGI高。 -PHP：PHP（Hypertext Preprocessor，超文本预处理器）是一种 HTML内嵌式的语言（类似于ASP）。 -JSP：JSP（Java Server Pages）是Sun公司推出的网站开发技术， 是将纯Java代码嵌入HTML中实现动态功能的一项技术。JSP代码被编 译成 Servlet并由Java虚拟机解释执行，这种编译操作仅在对JSP页 面的第一次请求时发生。（与ASP比较） ：微软在ASP之后推出的技术。与ASP有完全不同的架构，将前 台页面与后台程序页面完全分开。 -AJAX：最新的技术，可以实现页面无刷新更新，将在以后做详细介 绍。目前的G-mail、126、163邮箱、google map等都用到了此技术， 新的微软主页也大量使用了此技术。
网页设计与 制作教程(第三版)
1．BMP图像文件格式
BMP图像是Microsoft Windows所定义的图像 文件格式，在Windows中运行的图形图像软件都 支持BMP图像格式。BMP图像文件只能存放一幅 图像，图像数据有压缩或不压缩两种处理方式。
2．GIF图像文件格式
GIF图像是一种包含有帧、调色板、优化方 案等工作信息的位图格式。最多只支持256种颜色， 支持透明色。采用无损压缩的方法，产生的文件 很小。
5．PSD图像文件格式
PSD图像是著名图像处理软件PhotoShop中 使用的一种标准图像文件格式，能够保存图像处 理的每一个细节部分，便于图像的编辑和再处理。
1.2.3 色彩的属性
网页中的色彩是网页内容的一种表现，能够 突出地显示整个网站的风格，给人以视觉冲击。 不同的色彩搭配产生不同的效果，并可能影响到 访问者的情绪。好的色彩搭配具有感染力，同时 也具有象征性，所以确定网页的基准色彩就显得 尤为重要。
1.2.4 RGB色彩模式和Web安全色3
在图像处理软件中一般都有调色板，用户可 以通过调整RGB的数值选择所需的颜色。图1-7是 Fireworks 8中的调色板。
图1-7 Fireworks 8中的调色板
不同的操作系统和浏览器可能采用不同的调 色板。图像在网络发布后，色彩的显示可能会受 到浏览端的操作系统和浏览器的影响，同一种颜 色也许会在不同的浏览端显示出不同的明度或者 色相。
1.1.3 IP地址和域名
网络上的每一台计算机都必须有IP地址或域名 作为其独一无二的标识，就像我们每个人都有一个身 份证号一样，作为身份的确认。
IP地址是Internet上计算机的数字标识。两台计 算机不能有相同的IP地址。它通常由四个0～255间的 十进制整数和中分点构成，例如202.121.80.18、 196.2.56.3都是合法的IP地址。
网页设计与制作 第3版 第1章 网页制作与HTML5基础知识
第1章 网页制作与HTML5基础知识
1.2 Dreamweaver CS6概述
1.2.1 启动与退出Dreamweaver CS6
第1章 网页制作与HTML5基础知识
1.1 网页制作的基础知识
1.1.4 网页制作工具
“开始”菜 单中的“记 事本”程序
1．“记事本”程序 HTML代码可以使用Windows操作 系统自带的“记事本”（Notepad） 进行编写。使用时只需选择“开 始”→“程序”→“附件”命令 即可找到“记事本”程序
第1章 网页制作与HTML5基础知识
1.1 网页制作的基础知识
1.1.3 网页的基本组成元素
4．内容栏 内容栏是网页的主体，通常由一个或多个子栏组成，包含网页提供的 绝大部分信息和服务项目。 5．文本 文本容量小，传输速度快，用户可以快速地浏览和下载，是网页主要 的信息载体。网页中文本的样式多变，风格不一，能吸引用户的网页 通常都具有美观的文本样式。 6．图像 图像比文本更具生动性和直观性，它可以传递一些文本不能传递的信 息，Logo、背景等一般都是图像。
第1章 网页制作与HTML5基础知识
1.1 网页制作的基础知识
1.1.4 网页制作工具
2．EditPlus编辑器 EditPlus是一款非常好用的HTML 编辑器，除了支持颜色标记、 HTML标记，同时还支持C语言、 C++、Java等编程语言。另外， 它还有完整的CSS指令功能，编 写网页1.1 网页制作的基础知识
1.1.4 网页制作工具
2．EditPlus编辑器 EditPlus是一款非常好用的 HTML编辑器，除了支持颜 色标记、HTML标记，同时 还支持C语言、C++、Java 等编程语言。另外，它还有 完整的CSS指令功能，编写 网页代码可达到事半功倍的 效果
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
浏览器/服务器结构(Browser/Server, B/S)
尝试分析这两种模式的优缺点？
图示C/S结构
客户端和服务器都是指通 信中所涉及的两个应用进 程（软件） 这里，服务器程序是运行 中的数据库管理系统
这里，客户端程序是实现 用户登录、浏览、查询特 定数据、连接数据库的程 序
• 点分十进制记法：
− 由4个用“.”分隔的十进制数组成 − 每个数不大于255 − 如202.119.106.253
1.4 IP地址、域名和URL
1.4.1 IP地址
• IP地址可分成5类，其中常用的是如下三类。
• A类：用于规模很大、主机数目非常多的网络。A类地址 的最高位为0，接下来的7位为网络地址，其余24位为主 机地址。A类地址允许组成126个网络，每个网络可包含 1 700万台主机。 • B类：用于中型和大型网络。B类地址最高两位为10，接 下来14位为网络地址，其余16位为主机地址。B类地址 允许组成16 384个网络，每个网络可包含65 000台主机。
1.2 Web的工作原理
客户端Web浏览器 Web服务器 数据库服务器
三层结构（B/S）
互联网
优点
具有良好的开放性，利用单一的访问点，用户可以在任何地点使用系统；
用户可以跨平台以相同的浏览器界面访问系统；
因为在客户端只需要安装浏览器，基本上取消了客户端的维护工作，有效 的减少了整个系统的运行和维护成本。 跨越了局域网的限制，将应用分步到互联网
动态网页实现的方法一：Web客户端编程
• 客户端编程
– 程序员把客户端代码编写到HTML文件中。 – 当用户提出对某个网页的请求时，这些客户端代码 和HTML文件代码一起以响应方式返回提出请求的 浏览器。
• 常见的客户端编程技术
– VBScript – JavaScript – Java applet等。
一般客户端和服务器端程
序都需要安装
图示B/S结构
是对C/S结构的一种改进
仅仅通过浏览器完成用户登录和数据请求等少量业务逻 辑，绝大部分业务逻辑在web服务器完成
该模式不需安装专门的软件，只要打开浏览器完成 www浏览即可 是瘦客户端，便于维护和升级
B/S与C/S的区别
构成
• • •
– Web是Internet提供的一种服务。 – Web是存储在全世界Internet计算机中、数量巨大的文档 的集合（电子信息仓库、资源共享）。 – Web上的海量信息是由彼此关联的页面（Page）组成的 （超文本信息系统）。 – Web的内容保存在Web站点（Web服务器）中，用户可通 过浏览器访问Web站点（B/S模式）。 – Web以一些简单的操作方式连接全球范围的超媒体信息 （普及度高）。
（3）如果URL指向的是普通的HTML（Hypertext Markup Language，超文本标记语言）文档，Web服务器将直接把 它传送给浏览器。HTML文档中可能包含用Java、 JavaScript、ActiveX、VBScript等编写的程序，服务器也 将它们随HTML文档一道传送到浏览器，在浏览器所在的机 器上执行。 （4）如果HTML文档中嵌有ASP程序，那么Web服务器就运 行该程序，并将结果传送至浏览器。（ASP程序在客户端执 行）
理论学习
掌握基本概念，理解基本的知识 注重方法，不断更新知识 重视动态网页设计能力的培养
实践学习
勤思考，多动手 坚持自学 协同互助
内容安排(1)
基础知识
第1章 WEB编程基础知识 第 2 章 WEB应用程序开发环境
客户端技术
第 3 章 HTML与XML 第 4 章 脚本语言 第 5 章 页面设计
• C类：用于小型本地网络（LAN）。C类地址最高3位为 110，接下来21位为网络地址，其余8位为主机地址。
• 主机地址全0为本网络的网络地址、全1为本地广播 地址(保留地址)
1.4.2 域名
•IP地址是联网计算机的地址标识 •DNS：域名服务系统，允许为主机分配字符名称，即域 名。并且可以在网络通信时由DNS自动实现域名与IP地 址的转换。 • 例如，南京师范大学Web服务器的域名为 • Internet中的域名采用分级命名，其基本结构如下： 计算机名.三级域名.二级域名.顶级域名
1.3 Internet网络协议
1.3.2 HTTP协议
• HTTP（HyperText Transfer Protocol） – 专门为Web设计的协议 – 应用层协议 – 以TCP/IP协议集中的其他协议为基础 用户在进行网页浏览时，用户主机是 – Web浏览器和服务器用 HTTP协议来传输Web文档 否还和服务器保持连接？ – HTTP基于客户端请求、服务器响应的工作模式
互连网的域名管理机构将顶级域的管理权分派给指定的 管理机构，各管理机构对其管理的域继续进行划分，即划分 成二级域，并将二级域的管理权授予其下属的管理机构，依 此类推，便形成了树型域名结构。
1.4 IP地址、域名和URL
1.4.3 统一资源定位器URL
• 统一资源定位器URL（Uniform Resource Locator）是 用来确定某种信息位置的方法. •其格式如下： <信息服务类型>：//<信息资源地址>/<文件路径>
Web的特点
（1）Web是一种超文本信息系统。
（2）Web是图形化的和易于导航的。
（3） Web与平台无关。
（4）Web是分布式的。
（5）Web具有新闻性。
（6）Web是动态的、交互的。
1.2 Web的工作原理
客户端/服务器结构(Client/Server, C/S)
即时通信系统，如QQ、阿里旺旺 网络电视、网络游戏 银行柜台的现金出纳系统 往往通过客户机的应用程序连接到后台的数据库服 务器 BBS(电子公告板) 电子商务网站 网上银行 往往通过客户机的浏览器连接到后台数据库
• Web事务处理的步骤
– 客户端与服务器建立连接； – 客户端向服务器提出请求； – 如果请求被接受，则服务器送回响应，在响应中包括状态 码和所需的文件； – 客户端和服务器断开连接。
1.3 Internet网络协议
1.3.3 远程登录协议Telnet • Telnet：远程登录。 • 作用：使用户主机连入Internet上任何一台 用户在查看Telnet Telnet服务器(称为远程主机 )服务器上的信息时， 。 用户主机是否还和服务器保持连接？ • 用户主机就成为该远程主机的一个终端。 • 在用户的PC键盘上输入一个Telnet子命令后， 总能在远程主机上得到服务响应，并把结果送回 到用户的终端上。 •Telnet协议可以让用户主机共享Internet上各类 主机的资源，但不能把远程主机上的文件复制到 用户主机上。
本章介绍开发 Web应用程序必 备的基础知识， 为学习Web程序 设计方法和开发 技术做好准备。
什么是Internet
Internet的名称与定义
Internet的中文译名为因特网，也被称为国际互联网。 Internet的简单定义为：Internet就是由多个不同结构的网络， 通过统一的协议和网络设备（即TCP/IP协议和路由器等）互相连 接而成的、跨越国界的、世界范围的大型计算机互联网络。 Internet可以在全球范围内，提供电子邮件、WWW信息浏览与 查询、文件传输、电子新闻、多媒体通信等服务功能。 思考：计算机网络的定义？ 计算机网络就是将地理位置不同的多台计算机，通过通信设备和 线路将其进行物理上的连接，并按照协议进行通信，实现网络资源 共享的系统。
1.3 Internet网络协议
1.3.4 • FTP既是一种文件传输协议，也是一种服务。 •能使两台主机互传（复制）文件（Email对文件 大小有限制）
难点： 1、不知道要复制到文件位于哪个FTP 文件传输协议FTP 服务器？（Archie服务器） 2、传送文件的类型难以确定。
• 提供这种服务的设施叫做FTP服务器。
域名的结构在于：DNS将整个Internet划分成多个域，称之为 顶级域。顶级域名划分采用了两种划分模式，即组织模式 和地理模式。有7个域对应于组织模式，其余的域对应于 地理模式，如cn代表中国，us代表美国，jp代表日本等。 顶级域名分配如下： com 商业组织 edu 教育机构 gov 政府部门 mil 军事部门 net 网络中心 org 上述以外的组织 int 国际组织
1.3 Internet网络协议
1.3.1 TCP/IP协议
• TCP/IP协议是一个协议集，其中最重要的是TCP协议和IP协议
• TCP/IP参考模型与OSI参考模型的对照
作为最高层，向用户提供一些常用的 应用程序 处理来自传输层的分组发送请求； 处理接收的数据包； 负责应用进程之间的端到端通信 处理互联的路径； 接收IP层的IP数据报，通过网络向外 发送，接收并处理从网络传来的物理 帧，抽出IP数据报，向IP层发送
•服务器端编程
动态网页实现的方法二： Web服务器端编程
– 程序员将编写的代码保存在服务器上。
– 当用户提出对某个网页的请求时，这个请求所要访 问的页面代码都在服务器端执行，并把执行结果以 HTML文件代码的形式传回浏览器，这样浏览器接 收的只是程序执行的结果。
•常见的服务器端编程技术
– – – – PHP JSP ASP
Web服务器
• 两个层面的含义
– 指安装了Web服务程序的计算机
– 指Web服务器程序，可以管理各种Web文件，并为提出HTTP请 求的浏览器提供响应。
• Web服务器的配置
– 配置服务器操作系统
UNIX、Windows Server 2003、Linux等网络操作系统