web客户端技术简介.ppt

Web客户端技术 本章概述 HTML CSS javascript DOM HTML概述 在20世纪90年代Web网络的迅速兴起，使得HTML空前繁荣。当时，HTML被发展成了许多不同的版本。出于解决这种混乱局面的考虑，迫切需要制定一个公认的HTML语言规范。 1995年11月，Internet Engineering Task Force（IETF）整理了以前的各种版本，倡导并主持开发HTML2.0规范，同年推出HTML3.0技术规范。1996年，World Wide Web Consortium（W3C）的HTML Working Group开始组织编写新的规范，于1997年1月推出了HTML3.2。在HTML3.2中做了许多重要改动。到1999年下半年推出到现在依然使用的HTML4.0。 案例名称：HTML网页框架 HEAD头元素 HEAD头元素主要包括该页面的一些基本描述语句。META的属性包括： Description，网页的描述信息； Keywords，关键字，当搜索引擎查找时，按此关键字查找； Content-type，用来设置该网页的编码； Author，用来设置该网页的作者姓名； Refresh，用来设置网页的自动更新。当CONTENT =3; URL=时，该网页打开3秒钟后，就自动的转到网站 HTML的常用标记 HTML的常用标记有一些共同特点：都放在BODY标记里面。 常用的标记有字体标记、图片标记、超级链接、列表、表格和表单等。 字体标记 处理文字时通常利用如“FONT FACE=”隶书“ SIZE=”5“ COLOR=”red“ xx/FONT”的标记 定义字符xx的字体显示为隶书，字号是40，颜色是红色。程序2-03.htm说明如何使用文字格式。 图片标记 利用“IMG SRC=”myimage.jpg“ WIDTH=”300“ HEIGHT=”200“ BORDER=”10“”格式可以插入一张图片，myimage.jpg文件必须和该HTML文件放在同一个目录下。 IMG是HTML的一个标记，是IMAGE的缩写；SRC属性给出要连接的图片的路径和文件名 超级链接 使用超级链接的基本的语法是：A HREF=“Address.htm”XX/A。XX是一个超级链接，连接到Address.htm文件； A是单词Anchor的缩写，中文的意思是“锚”，功能是从一个页面链接到另一个页面；属性HREF定义的是链接到哪一页。 书签链接 如果某个页面很大，为了加强层次感，需要引入书签链接。 使用的方法和超级链接类似。 电子邮件链接 电子邮件链接提供了当点击页面上的链接时，将自动打开默认的邮件发送程序发邮件。 列表 列表有两种方式，一种是有序列表，另一种是无序列表。 无序列表是所有的行之前都有一个小圆圈，而有序列表是自动排序的，前面有序号。 基本表格 TABLE是表格的基本标记。TR代表表格的行，TD代表表格的列。 定义一个三行两列的表格如程序2-09.htm所示。 表格的灵活应用 （1）ROWSPAN和COLSPAN属性的使用方法。 利用ROWSPAN属性设置该单元格占用多行，利用COLSPAN属性设置该单元格是占用多列。 Cellpadding和Cellspacing （2）Cellpadding和Cellspacing属性的使用方法。 Cellpading的意思是单元格的边距，指的是字与单元格边框的距离。Cellspacing的意思是单元格间距，指的是单元格之间的距离。 表格的样式 BORDERCOLOR属性设置表格边框的颜色，BGCOLOR属性设置背景颜色，ALIGN属性设置表格的对齐方式，B标记是将内部的文字加粗显示。 表单 表单的功能是收集用户信息实现系统与用户交互。比如E-mail信箱的注册页面就是一个十分典型的表单页面。 表单信息的处理过程为：当单击表单中的提交按钮时，表单中的信息就会上传到服务器中，然后由服务器端的应用程序（例如CGI，ASP，PHP或JSP等）进行处理，处理后将用户提交的信息存储在服务器端的数据库中，或者将有关信息返回到客户端浏览器上。 （1）表单头及其属性 表单的通用格式是：FORM METHOD=“Post” ACTION=“do_submit.asp”XX /FORM。 表单元素包含在FORM标记中，有两个重要的属性：METHOD=“Post”或“Get”，Post和Get方式的区别在于Post是一种邮寄的方式，在浏览器的地址栏中不显示提交的信息，这种方式传送的数据量的大小没有限制；Get方式将信息传递到浏览器的地址栏上，最大传输的信息量是2 KB。当不指明是哪种方式时，默认为Get方式。Action属性是