第9章Web基础知识

第9章Web基础知识JSP技术是建立在Servlet技术基础之上，并与其他Web技术相结合使用，这些Web技术包括HTML标记语言、CSS样式表以及JavaScript语言等。HTML标记是网页的基本组成部分；CSS用来定义页面元素显示外观；而JavaScript可以在客户端动态修改页面元素。在本章将分别介绍这三方面的基础知识。12本章知识要点：•了解Web技术的产生和发展•了解HTTP协议核心机制•熟练掌握HTML语言•熟悉掌握CSS样式表•熟悉掌握JavaScript脚本语言•理解HTML、CSS和JavaScript之间的关系39.1Web发展及HTTP协议•1989年仲夏之夜，TimBerners-Lee成功开发出世界上第一个Web服务器和第一个Web客户机。在1991年CERN（EuropeanParticlePhysicsLaboratory）正式发布了Web技术标准。目前，与Web相关的各种技术标准都由著名的W3C组织（WorldWideWebConsortium）管理和维护。9.1.1Web产生与发展•作为Internet上的一种应用架构，Web结构的首要任务就是向人们提供信息服务。评价一种Web开发技术优劣的标准有且只有一个：这种技术能否在最适合的时间和地点，以最恰当的方式，为最需要信息的人提供最适合的信息服务。这一标准推动Web不断向前发展。Web是一种典型的分布式应用架构。Web应用中的每一次信息交换都要涉及到客户端和服务端两个层面。因此，Web开发技术大体上也可以被分为客户端技术和服务器端技术两大类。49.1.2HTTP协议HTTP是一个属于应用层的面向对象的协议，由于其简捷、快速的处理方式，适用于分布式超媒体信息系统。HTTP协议在1990年被提出，经过几年的使用与发展，逐渐得到完善和扩展。目前在的第六版，HTTP/1.1的规范化工作正在进行之中，而且HTTP-NG(NextGenerationofHTTP)的建议已经提出。59.2HTML标记语言•HTML（HyperTextMarkupLanguage，超文本标记语言），它跟一般的文本处理器不同的地方在于，它具有超文本（HyperText）、超链接（HyperLink）、超媒体（HyperMedia）的特性，通过HTTP（HyperTextTransferProtocol）网络通讯协议，便能在万维网(WorldWideWeb)中进行数据交互。在本节将介绍有关HTML标记元素的使用。69.2.1HTML基本元素•所谓“超文本”（Hypertext）和一般传统文件最大的不同就是，传统文本只能按照顺序进行阅读，而Hypertext借助于一些特殊标签（例如超链接），可以以树状甚至网状结构来组织文本内容。通过在文本中插入标记（Markup）来赋予文字一些特性，如标题、段落、链接等等。标记是由“小于（）”与“大于（）”这两个符号所包围的文字，如果想对某段文字加上特别的意义，我们只要在该段文字前后分别加上开始标记与结束标记即可，例如title这是标题/title。79.2.2文字与段落•文字布局标记用来排版页面中的文字。常用的文字布局标记可以分为：行控制标记、文字分区标记、列表标记等。•行控制标记用来控制文本的段落和换行情况。包括三个常用标记有段落标记p、换行标记br和不换行标记nobr。89.2.3超级链接•所谓的超链接是指从一个网页指向一个目标的链接关系。这个目标可以是一个网页；也可以是本网页的不同位置；还可以是一个图片；一个电子邮件地址、一个文件，甚至是一个应用程序。而在一个网页中作为超链接的对象，可以是一段文本或者是一个图片。超链接本质上是属于网页的一部分，它是一种允许我们同其他网页或站点进行链接的元素。各个网页链接在一起后，才能真正构成一个网站。当浏览者单击已经链接的文字或图片后，链接目标将显示在浏览器上，并且根据目标的类型来打开或运行。99.2.4多媒体标记•多媒体标记有BGSOUND和EMBED。BGSOUND标记用来插入背景音乐，但只适用于IE，基本语法如下所示：•BGSOUNDsrc=your.midautostart=trueloop=infinite10119.2.5表单标记•表单可以用来向Web服务器发送数据，特别是经常被用在联系表单——用户输入信息然后发送到Email中。实际用在HTML中的标记有form、input、textarea、select和option。129.2.6表格标记•HTML表格是收集Web信息最常用的方法，是在Web页上提供用户界面控件的特殊的HTML标记的排列。如果网页里没有一个表格，那可以说算不上一个网页(当然全FLASH作品除外)，表格的重要性就可想而知。它可以帮助我们控制网页布局、控制内容的显示等等。使用表格排版网页，可以使你的网页更美观，条理更清晰，更易于维护和更新。(将表格的宽设为100%，可以使网页的兼容性更好)。9.3CSS样式表•在主页制作时采用CSS技术，可以精确地设置文字的大小、文字的间距、行距、图层重叠、绝对定位和相对定位等，但其最强大的功能还在于它具有可插拔的特性和易操作性。只要对CSS文档中相应的代码做一些简单的修改，就可以改变同一页面的不同部分，或者不同页面的外观和格式。CSS通过定义样式的方式可以增强网页的视觉效果与简化页面设计。139.3.1CSS概念•CSS是CascadingStyleSheet的缩写，中文译为层叠样式表，常称为CSS样式表或样式表，其扩展名为.css。CSS是用于增强或控制网页样式并允许将样式信息与网页内容分离的一种标记性语言。14159.3.2使用CSS•CSS的主要功能就是将某些规则应用于文档中同一类型的元素，这样可以减少网页开发者大量的工作。169.4JavaScript脚本语言•HTML通过与JavaScript相结合就可以创建出具有动态的、交互性的页面。用户可以将JavaScript嵌入到普通的HTML网页里并由浏览器执行，从而可以实现动态实时的效果。另外，使用JavaScript对表单进行检验将大大降低服务器的负荷，提高页面响应速度。本章将对使用JavaScript时需要掌握的基础知识进行介绍，包括JavaScript数据类型、常量、变量、控制语句以及函数等。9.4.1JavaScript概述•JavaScript是由Netscape公司开发的一种基于对象和事件驱动并具有安全性能的脚本语言（ScriptingLanguage），或者称为描述语言，主要用在Internet的客户端上。在HTML基础上，使用JavaScript可以开发交互式Web网页。JavaScript的出现使得网页和用户之间实现了一种实时性的、动态的、交互性的关系，使网页包含更多活跃的元素和更加精彩的内容。179.4.2JavaScript基础语法•JavaScript是一种脚本语言，它也具有自己的数据类型、变量标识符、运算符和流程控制。在本部分将详细介绍JavaScript的数据类型、变量和运算符等相关知识。18数据类型数据类型名称示例number数值类型123、071（十进制）、0X1fa（十六进制）string字符串类型'Hello'、'getthe&'、'[e-mail]'、”Hello”object对象类型Date、Window、Document、Functionboolean布尔类型true和falsenull空类型nullundefined未定义类型没有被赋值的变量所具有的“值”9.4.3JavaScript对象•在JavaScript中，常有的对象有下面几种形式，浏览器对象，脚本对象，HTML对象。浏览器对象就是浏览器窗口window、文档document、URL地址等；脚本对象是String字符串对象、Date日期对象、Math数学对象、数组等；HTML对象是各种HTML标签:段落P、图片IMG、超链接A等。实际上还有一个对象也是经常使用到的，就是函数对象。199.4.4JavaScript事件•事件处理是对象化编程的一个很重要的环节，没有了事件处理，程序就会变得很死，缺乏灵活性。事件处理的过程可以这样表示：发生事件--启动事件处理程序--事件处理程序做出反应。其中，要使事件处理程序能够启动，必须先告诉对象，如果发生了什么事情，要启动什么处理程序，否则这个流程就不能进行下去。事件的处理程序可以是任意JavaScript语句，但是我们一般用特定的自定义函数（function）来处理事情。209.4.5JavaScript表单验证•JavaScript通常在客户端用来验证用户输入数据的校验。下面实例使用JavaScript语言来验证用户输入信息是否满足规定长度。用于接受用户数据信息的页面为check.html。219.4.6JavaScript其他功能•在上一节中介绍了JavaScript基础语法知识，通过一个实例说明如何使用JavaScript获取用户输入的数据。在本节将通过实例介绍如何使用JavaScript控制页面元素。该实例使用JavaScript创建一个电子时钟，通过时钟界面上的按钮可以控制时钟的显示格式。22