Html标记.ppt

上传人:hyn****60 文档编号:71436119 上传时间:2023-02-03 格式:PPT 页数:136 大小:223KB
返回 下载 相关 举报
Html标记.ppt_第1页
第1页 / 共136页
Html标记.ppt_第2页
第2页 / 共136页
点击查看更多>>
资源描述

《Html标记.ppt》由会员分享,可在线阅读,更多相关《Html标记.ppt(136页珍藏版)》请在得力文库 - 分享文档赚钱的网站上搜索。

1、Html标记标记的形式标记本身也是文字字符串。l标记总是处于“”之间,并且这两个符号和标记名字之间不含有空格符l标记一般是成对出现的l开始符和结束符的区别就是在“”号后面有一个斜线“/”例如:标记示例单个的标记以及标记的属性l单个标记、l标记的属性属性是标记的附属集合,这些属性一般置于开始符号的括号中,并用等号“=”赋值,这个值依然处于括号中。用来精确的显示确定这些标记的显示方式。例1:例2:复合属性标记属性(2)l如果属性的值是一个简单的词或者是数字,并不包含空格符。那么可直接放在等号后面。否则的话需要加上单引号或者双引号。l等号的两边是可以存在空格的。l复合属性里面。属性出现的顺序是无关紧

2、要的。标记的语法l标记和属性是不分大小写的。如:与是一样的l结束标记没有属性l标记可以嵌套使用但必须由内至外的顺序来使用。l允许忽略标记的现象存在。Html基本结构l以开始并以结束l中间是两个主要的部分:头部字段和主体标记对中通常放置的是一些不出现在browser中的网页信息标记对则放置的是所有出现在browser中的内容。l文档类型定义(DTD)DTD文件包含用于控制网页的所有标记属性和规则。使用的是这样的标记。应该放在html的最前端。示例:示例:标记的属性lDIR属性指定了浏览器文字的阅读方向。可以赋值为ltr、rtl。默认值为前者例子:例子:P103 lLANG属性用来指定标识符中的文

3、本内容所采用的语言种类。用在这里这是将一个语言运用到整个网页。lVERSION属性定义Html的版本VERSION=“-/W3C/DTDHTML4.01/EN”标记及其属性l头部字段用来用来描述文档的属性,绝大部分文档标是不出现在浏览器的网页信息。主要是为搜索引擎和其他自动代理服务。l头部字段中所包含的标记、l标记的属性具有以下属性dir、lang、profile(格式尚未指定)标记l能起到区别网页的作用,网页载入浏览器的时候,标题出现在标题域中。有且只有一个这样的标记。示例:l如果浏览器没有发现标记,它会将其文档名置于标题域。l如果标题长度比浏览器的标题还要长,则超出的部分会被截去。标记l用

4、于添加网页的不显示信息,这部分信息包括作者、制作日期、口令等。用于帮助搜索引擎搜寻其所需要信息的时候无须查找整个网页l格式:http-equiv:表明网页需求的标题信息Name、content:使得这些信息可被用来引用如:课本P106示例:标记l用于定义网页中所有链接的基本URL其唯一的属性是href。用于给出URL。基本URL要包括协议和服务器名如:http:/l所有的相对链接都默认包含使用基于该标记的附加路径信息,可避免每次都输入相同的URL。示例:与的区别标记用来定义相对链接的基本值,而标记用于为网页中使用到的外部文件(比如类型定义及其描述)提供链接。示例:标记及属性l标记作用于Html

5、文档的主体部分,有一系列的属性来控制文档的颜色和背景等。l主要有以下属性bgcolor(背景色彩)text(非可链接文字的色彩)link(可链接文字的色彩)alink(正被点击的可链接文字的色彩)vlink(已经点击过的可链接文字的色彩)示例1示例2文字、列表和链接l文字网页中的文字是不可缺少的元素任何被置于标记之间的文字都会被显示出来。如何将文字分段落?l使用标记,标记具有align属性,该属性用来调准文字位置。示例:标题标记l标题用于在文字段落上设立标题,Html包括几种不同的标题形式。一些比正常字体小,但所有的标题形式均是以粗体来显示的。共有六种l与标记类似。标题总是另起一行来显示。示例

6、:标记l会在浏览器中间显示一条水平分割线,并有强制换行的作用。l具有下列属性sizewidthalignnoshadecolor格式:示例:改变文字的尺寸l标记使用该标记可以改变标记的文字的尺寸大小。具体方法:使用font标记里的size属性格式:文字lsize属性的定义域是从1到7。7最大。也可在尺寸标示符前加“+”、“-”号以从默认设置的尺寸上来增减。示例:另一种方法lbig、small标记方法:只需要用或标记围绕你所需要改变大小的文字即可如:欲变大的文字欲变小的文字创建Drop capl许多书第一段的第一个字母都比其余文字大得多。这种技术叫“dropcap”,示例:应用粗体和斜体格式l和

7、标记标记表示在这对标记中的文字为粗体标记表示在这对标记中的文字为斜体l两者可以联合使用,顺序无关紧要。但要注意防止交叉。示例:下划线和中划线l、标记:标记使被标记文本具有下划线、:使文本具有中划线使用方法:被标记文本被标记文本被标记文本示例:下标和上标l、标记下标的文字将会将位于浏览器窗口默认文字稍微偏下的地方;上标的文字将会出现在则位于浏览器窗口中默认文字稍微偏上的地方。示例:l小技巧可以与标记结合起来用,以缩小上下标的尺寸示例:打字文字(等宽文字)l标记使文字看起来如同打字机打出一样。被该标记标记的文字。没个字母所占宽度是一样的。如:字母I与W所占的宽度是一样的。强调标记l、标记强调标记属

8、于逻辑标记,不同于以往的固有标记。的默认格式是标记的默认格式是标记使用方法:被强调文本被强调文本引用标记l标记cite标记用于标出引证之处,该标记的默认设置文字呈倾斜格式。单标记具有与标记的功能示例:缩略字l表示所包含的文本是单词或者是短语的缩写。与其类似的还有标记。示例:标记插入和删除文字l、标记标记用于在原文中插入文字标记用于在原文中删除文字示例:这两个标记都有cite和datetime属性Cite属性:表明插入的理由Datatime属性:表明作出改动的时间。标记代码文字l、标记的作用:用于标记语法:用语标记代码中的变量:用于表示从键盘输入的文本:用于表示从上下文里抽出来的文本示例:定义标

9、记l标记用来标记那些对术语或字符的定义.示例:顺序列表l顺序列表是一种在每个元素前按数字顺序标号的列表形式。使用方法:以打开和关闭标记作为开始。然后,在每个列表元素前用标记标识.标识不需要添加结束标记。示例:改变标记中数字化的类型lType属性该属性用来改变列表的数字类型,类型包括:标准的阿拉伯数字(1)、小写英文字母(a)、大写英文字母(A)、小写罗马字母(i)和大写的罗马字母(I).使用方法:示例:构建无序列表无序列表又被称为小圆球列表l使用标记来开始其余的同有序表是一样的。Type属性:用来改变小圆球的形状,形状可以被置成discSquare、circle形状示例:链接链接使得world

10、wideweb更加“宽阔”通过链接用户能快速而方便地在许多不同网页中浏览l标记用来创建文字链接该标记中的href属性保存了链接所联系的地址l标记中的内容均被作为链接。包括文字和图像。l标记只能接受一个href属性,也只能指向一个页面。示例:名称链接l在网页中制造出“链接点”,使页面内的链接能快速到达链接点所在的文本处。方便查询。l必须在链接名称前包含数字符号(#)。例如:欲创建一个名称为TOP的链接点格式:l当标记用于名称链接时,不需要结束标记,用于其它链接的时候则需要。示例:将图像添加到WEB页面l使用标记向网页中加入图像。地址在src属性中被指定.示例:l指定图像的大小通过设置width和

11、height两个属性来达到这个目的格式:示例:提示:增加width和height属性的设置可以加快网页的下载,同一图像的大小不影响下载的速度。图像具有文字说明的效果可选的文字是与图像有关的一些说明,当用户将鼠标放到并停在图像上时,相关文字将会显示出来l使用方法设置alt属性格式示例:图像的链接图像通常能比文字更好的作为超级链接。许多的网站的导航条目都是利用图像代替文字来做链接的。l如何做到?用标记来包围标记即可格式:示例:表格(page131)l使用、来创建简单的表格。:标记了表格的开始和结束.:标记了新的一行的开始.:在每行中标记新的单元格体系结构如下体系结构如下:单元格的内容示例:表格(2

12、)l标识符仅用来标记新行而不能包含任何内容。l内容可以在间设置.标记包含于内l内的标记对的数目决定了表格中行的数目.内的标记对的数目决定了一行中所含的单元格的数目。l为了显示带边框的表格.需要设置标记里的border属性。默认的设置是不显示边框.对border设置任何非零值将自动在单元格间和表格周围加入边框.然而,当border值大于1时将仅会影响表格边框而不会影响单元格的边框。示例:表格尺寸的设置l除非专门设置,包含于单个单元格内的内容决定了整个表格的宽度.l可以在内使用width属性,设置整个表格的宽度.这个值以像素数目或用占browser窗口的百分比来设定.示例1:示例2l设置一个单元格

13、的尺寸会影响到同一行或列的所有其它单元格的尺寸。表格及单元格内文字的对齐l使用标记里align属性,可以指定表格左对齐或右对齐于浏览器边缘示例:l使用、标记里的align、valign属性,可以使单元格内的文字处于不同的位置。示例1:示例2:使用行标题和列标题l通过用代替标识符可以向表格添加标题。l如果要产生列标题,就将所有标识符放在第一行中。如果只改变每行的第一个则可以产生行标题。l标识符不必置于产生该表格边上的单元格内。它们可以出现在任何一个位置。只不过是出现在列顶部或行头行尾,会使意义更加明显而已。示例:设置表格内的色彩l使用bgcolor属性,可以为整个表格或单独行或单元格设置背景色彩

14、。bgcolor属性可以被加入到、标识符内。l还可以使用background属性来设置大到表格,小到单元格的背景图片.示例:背景示例单元格间隙和内部空格设置l标记包含两个属性能够用来在内容或单元格之间加入空格.cellpadding属性在单元格文字和单元格边缘加入空格cellspacing属性在每个单元格之间加入空格这两个属性值均以像素值来衡量.默认值为0。示例1:示例2:跨多行的单元格在设计表格的时候,有时候需要将两个或更多的邻接单元格组合成一个单元格。可以使用以下两个属性来实现这一点。这些属性在或中。lrowspan用来至少结合两个竖直单元格示例:lcolspan用来至少结合两个水平单元格

15、示例:行或列的跨越在内容不能完全放于一个单元格时非常有用。通过跨越许多单元格,不需要更改表格就能使更多的文字放入单元格.添加表格标题一般当我们看到一个表格的时候。通常在表格的上方或下方有一个标题.用来对表格中的信息进行提示l标记可以出现在标记的任何位置.通过将align设为top或bottom,标题能够显示在表格的上方或下方.默认的设置是在表格的顶部中间.示例:使用标记的好处是可以使标题随着表格的移动而自动移动。这是一般的文本所做不到的。表单的使用(page126)表单在实质上实现了用户的信息输入。它通过一些基本的控件,收集用户的请求信息,然后把这些信息传给相应的处理程序,由这些程序对用户的请

16、求做出回应。l表单所包含的控件。输入文本框、下拉列表框、按钮l表单的使用格式及所具有的属性action属性:用来确定表单所采集的信息提交给哪个服务器应用程序。method属性:用来确定表单数据提交的方式。一般有post与get两个值。表单2target属性用来确定服务程序将结果返回时在哪个框架窗口中来显示结果。l如何将控件添加到表单里方法:在表单标记对.中添加标记。type:表明该控件的类型(buttoncheckbox)name:该控件在整个HTML文档中的名称。value:表明该控件被触发的时候,传送给服务程序的值.表单3l在表单中加入按钮示例:lsubmit与reset按钮submit按

17、钮在按下的时候。会将整个表单里的所有数据发往服务程序.reset按钮在按下的时候有清除所有文本域并将所有其它的表单元素恢复到默认值的作用。示例:l在表单中加入复选框表单4复选框一般都是以成组的方式出现的,可以使用name属性来给复选框命名。示例:使用复选框的checked属性可以使该复选框在初始时被标记为已经选择。示例:单选择按钮l单选按钮同复选按钮很相似。只不过在同一时刻单选按钮只能允许一个选项被选中。使用方法:示例:要注意的地方:P127最后一行示例文本字段输入区域l文本域是一个可以让用户在其中输入字符或者是单行文本的表单元素。使用方法:示例:maxlength:表示你可以往这个输入框里输

18、入的最大的文字的个数.size:表示这个文本输入框的显示宽度password类型的文本字段输入框文本区域l文本区域是可以输入多行文字的一个区域.l使用标记来在网页上创建一个文本区元素。使用方法L:.rows:指定这个文本框显示的行数,cols:指定这个文本框显示的列数.wrap:指定文本的换行方式.可以分别取“off”、”soft”、”hard”。示例:列表框(下拉表单)l使用方法123nsize:表示下拉菜单一次显示的可选项目的个数.multiple:允许有多项被选。示例:框架(page 136)框架是一种页面布局的元素,与表格的作用对象是不同的。框架可以把浏览器分割成一个个的小窗口。从而使

19、一个浏览器窗口可以显示多个网页。l标记称之为框架容器,用来代替来充当容器,可以利用这个标记将浏览器窗口进行水平或垂直分割.所用到的属性是rows和cols.rows:水平分割cols:垂直分割l不能既指定rows又指定cols。浏览器不清楚在哪个行中分列。示例1:示例2:确定每个框架的显示内容l使用标记来指定显示在框架中的内容。每个内容都是一个独立的网页。l、属性.通过来命名一个被引用的网页.通过用来指定所引用的网页的URL.但也可以是任何能被浏览器显示的元素。示例:确定框架所占像素的宽度l在的开始标记内,用户可以用像素来指定框架的实际宽度。也可以使用符号“*”来代替需填满剩余空间的框架。像素

20、和比例值可以在一个单一属性里结合起来使用.示例:l当框架在browser中显示时,会自动加上边框。可以通过设置frameborder属性来删除这个边框示例:设置页面空白l通过设置属性marginwidth和marginheight来设置框架的空白区域。marginwidth:既设置左边的空白区也设置右边的空白区。marginheight:既设置顶端的空白区也设置底端的空白区。示例:lnoresize属性用来控制是否允许改变框架的大小。示例:滚动条l通过在标记中加入scrolling属性,可以控制框架中是否显示滚动条.属性取值范围为:yes、no、auto。默认设置是auto。示例:标记的嵌套使

21、用.l复杂的框架设计中常使用这样的方法。嵌套使用可以使一个框架的行分为几列,也可以使一列分为几行。使用方法:将某一个标记中的替换成一组标记即可。示例:注意:在一个页面中不适宜布置太多的框架。太多会让人产生烦乱的感觉。设置框架的目标l框架的作用是将页面分成几个区域,从而能有一个功能上的分区。框架之间是可以建立起内在的联系的。l使用target属性可以设置被链接的页面在指定的框架中显示。格式:文本示例:Marquee标记滚动文本内容示例:l一、什么是JavaScriptlJavaScript是一种基于对象(Object)和事件驱动(EventDriven)并具有安全性能的脚本语言。使用它的目的是与

22、HTML超文本标记语言、Java脚本语言(Java小程序)一起实现在一个Web页面中链接多个对象,与Web客户交互作用,从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷,它是Java与HTML折衷的选择,具有以下几个基本特点Javascriptl1.是一种脚本编写语言lJavaScript是一种脚本语言,它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个易的开发过程。它的基本结构形式与C、C+、VB、Delphi十分类似。但它不像这些语言一样,需要先编译,而是在程序运行过程中

23、被逐行地解释。它与HTML标识结合在一起,从而方便用户的使用操作。l2.基于对象的语言JavaScript是一种基于对象的语言,同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。l3.简单性lJavaScript的简单性主要体现在:首先它是一种基于Java基本语句和控制流之上的简单而紧凑的设计,从而对于学习Java是一种非常好的过渡。其次它的变量类型是采用弱类型,并未使用严格的数据类型。l4.安全性lJavaScript是一种安全性语言,它不允许访问本地的硬盘,并不能将数据存入到服务器上,不允许对网络文档进行修改和删

24、除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止数据的丢失。l5.动态性的lJavaScript是动态的,它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的反映响应,是采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页(HomePage)中执行了某种操作所产生的动作,就称为“事件”(Event)。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。l6.跨平台性JavaScript是依赖于浏览器本身,与操作环境无关,只要能运行浏览器的计算机,并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦

25、想。实际上JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑,软件仅需一个字处理软件及一浏览器,无须WEB服务器通道,通过自己的电脑即可完成所有的事情。JavaScript和Java的区别 虽然JavaScript与Java有紧密的联系,但却是两个公司开发的不同的两个产品。Java是SUN公司推出的新一代面向对象的程序设计语言,特别适合web应用程序开发;而JavaScript是Netscape公司的产品,其目的是为了扩展Netscape的浏览器功能而开发的一种可以嵌入Web页面中的基于对象和事件驱动的解释性语言,它的前身是LiveScript;而Java的前身是

26、Oak语言。下面对两种语言间的异同作如下比较l1.基于对象和面向对象lJava是一种真正的面向对象的语言,即使是开发简单的程序,必须设计对象。lJavaScript是种脚本语言,它可以用来制作与网络无关的,与用户交互作用的复杂软件。它是一种基于对象(ObjectBased)和事件驱动(EventDriver)的编程语言。因而它本身提供了非常丰富的内部对象供设计人员使用。l2.解释和编译l两种语言在其浏览器中所执行的方式不一样。Java的源代码在传递到客户端执行之前,必须经过编译,因而客户端上必须具有相应平台上的仿真器或解释器,它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。lJ

27、avaScript是一种解释性编程语言,其源代码在发往客户端执行之前不需经过编译,而是将文本格式的字符代码发送给客户编由浏览器解释执行。l3.强变量和弱变量l两种语言所采取的变量是不一样的。Java采用强类型变量检查,即所有变量在编译之前必须作声明。如:Integerx;Stringy;x=1234;x=4321;其中X=1234说明是一个整数,Y=4321说明是一个字符串。JavaScript中变量声明,采用其弱类型。即变量在使用前不需作声明,而是解释器在运行时检查其数据类型,如:x=1234;y4321;前者说明x为其数值型变量,而后者说明y为字符型变量。l4.代码格式不一样lJava是一

28、种与HTML无关的格式,必须通过像HTML中引用外媒体那么进行装载,其代码以字节代码的形式保存在独立的文档中。lJavaScript的代码是一种文本字符格式,可以直接嵌入HTML文档中,并且可动态装载。编写HTML文档就像编辑文本文件一样方便。l5.嵌入方式不一样l在HTML文档中,两种编程语言的标识不同,JavaScript使用.来标识,而Java使用.来标识。l6.静态联编和动态联编lJava采用静态联编,即Java的对象引用必须在编译时的进行,以使编译器能够实现强类型检查。lJavaScript采用动态联编,即JavaScript的对象引用在运行时进行检查,如不经编译则就无法实现对象引用

29、的检查。第一个JavaScript程序编写第一个JavaScript程序。通过它可JavaScrip的脚本是怎样被嵌入到HTML文档中的。ltest1.html文档:/JavaScriptAppearshere.alert(欢迎你浏览山西之窗网站!);alert(我的网址是:);alert(山西之窗,了解山西的窗口!);l程序说明:l(1)test.html是HTML文档,其标识格式为标准的HTML格式;(2)如同HTML标识语言一样,JavaScript程序代码是一些可用字处理软件浏览的文本,它在描述页面的HTML相关区域出现。(3)JavaScript代码由.说明。在标识.之间就可加入Ja

30、vaScript脚本。(4)alert()是JavaScript的窗口对象方法,其功能是弹出一个具有OK对话框并显示()中的字符串。(5)通过标识说明:若不认识JavaScript代码的浏览器,则所有在其中的标识均被忽略;若认识,则执行其结果。使用注释这是一个好的编程习惯,它使其他人可以读懂你的语言。(6)JavaScript以标签结束。l从上面的实例分析中我们可以看出,编写一个JavaScript程序确实非常容易的。JavaScript基本数据结构 JavaScript脚本语言同其它语言一样,有它自身的基本数据类型、表达式和算术运算符以及程序的基本框架结构。JavaScript提供了四种基本

31、的数据类型用来处理数字和文字,而变量提供存放信息的地方,表达式则可以完成较复杂的信息处理。l1.基本数据类型l在JavaScript中四种基本的数据类型:数值(整数和实数)、字符串型(用“”号或括起来的字符或数值)、布尔型(使True或False表示)和空值。在JavaScript的基本类型中的数据可以是常量,也可以变量。由于JavaScript采用弱类型的形式,因而一个数据的变量或常量不必首先作声明,而是在使用或赋值时确定其数据的类型的。当然也可以先声明该数据的类型,它是通过在赋值时自动说明其数据类型的。l2.常量l(1)整型常量JavaScript的常量通常又称字面常量,它是不能改变的数据

32、。其整型常量可以使用十六进制、八进制和十进制表示其值。l(2)实型常量实型常量是由整数部分加小数部分表示,如12.32、193.98。可以使用科学或标准方法表示:5E7、4e5等。l(3)布尔值布尔常量只有两种状态:True或False。它主要用来说明或代表一种状态或标志,以说明操作流程。它与是不一样的,可以用或表示其状态,而JavaScript只能用True或False表示其状态。l(4)字符型常量使用单引号()或双引号(“)括起来的一个或几个字符。如ThisisabookofJavaScript、3245、ewrt234234等。l(5)空值JavaScript中有一个空值null,表示什

33、么也没有。如试图引用没有定义的变量,则返回一个Null值。l(6)特殊字符同语言一样,JavaScript中同样以有些以反斜杠()开头的不可显示的特殊字符。通常称为控制字符。l变量的主要作用是存取数据、提供存放信息的容器。对于变量必须明确变量的命名、变量的类型、变量的声明及其变量的作用域。l(1)变量的命名JavaScript中的变量命名同其计算机语言非常相似,这里要注意以下两点:lA.必须是一个有效的变量,即变量以字母开头,中间可以出现数字如test1、text2等。除下划线()作为连字符外,变量名称不能有空格、()、()、(,)或其它符号。lB.不能使用JavaScript中的关键字作为变

34、量。l在JavaScript中定义了40多个类键字,这些关键是JavaScript内部使用的,不能作为变量的名称。如Var、int、double、true不能作为变量的名称。在对变量命名时,最好把变量的意义与其代表的意思对应起来,以免出现错误。l(2)变量的类型在JavaScript中,变量可以用命令Var作声明:varmytest;该例子定义了一个mytest变量。但没有赋予它的值。Varmytest=”Thisisabook”该例子定义了一个mytest变量,同时赋予了它的值。在JavaScript中,变量以可以不作声明,而在使用时再根据数据的类型来确其变量的类型。如:x=100y=125

35、xy=Truecost=19.5等。其中x整数,y为字符串,xy为布尔型,cost为实型。l三、表达式和运算符l1.表达式l在定义完变量后,就可以对它们进行赋值、改变、计算等一系列操作,这一过程通常又叫称一个叫表达式来完成,可以说它是变量、常量、布尔及运算符的集合,因此表达式可以分为算术表述式、字串表达式、赋值表达式以及布尔表达式等。l2.运算符l运算符完成操作的一系列符号,在JavaScript中有算术运算符,如、-、*、/等;有比较运算符如!、等;有逻辑布尔运算符如!(取反)、|、|;有字串运算如、等。在JavaScript主要有双目运算符和单目运算符。其双目运算符由下列组成:操作数操作数

36、1运算符运算符操作数操作数2即由两个操作数和一个运算符组成。如5040、This+that等。单目运算符,只需一个操作数,其运算符可在前或后函数l函数函数为程序设计人员提供了一个丰常方便的能力。通常在进行一个复杂的程序设计时,总是根据所要完成的功能,将程序划分为一些相对独立的部分,每部分编写一个函数。从而,使各部分充分独立,任务单一,程序清晰,易懂、易读、易维护。JavaScript函数可以封装那些在程序中可能要多次用到的模块。并可作为事件驱动的结果而调用的程序。从而实现一个函数把它与事件驱动相关联。这是与其它语言不样的地方。l1.JavaScript函数定义lFunction函数名(参数,变

37、元)函数体;Return表达式;函数说明l说明:当调用函数时,所用变量或字面量均可作为变元传递。函数由关键字Function定义。函数名:定义自己函数的名字。参数表,是传递给函数使用或操作的值,可以是常量、变量或其它表达式。通过指定函数名(实参)来调用一个函数。必须使用Return将值返回。函数名对大小写是敏感的。函数中的形式参数:l在函数的定义中,我们看到函数名后有参数表,这些参数变量可能是一个或几个。那么怎样才能确定参数变量的个数呢?在JavaScript中可通过arguments.Length来检查参数的个数。例:Functionfunction_Name(exp1,exp2,exp3,

38、exp4)Number=function_Name.arguments.length;if(Number1)document.wrile(exp2);if(Number2)document.write(exp3);if(Number3)document.write(exp4);.事件驱动及事件处理l1.基本概念lJavaScript是基于对象(object-based)的语言。这与Java不同,Java是面向对象的语言。而基于对象的基本特征,就是采用事件驱动(event-driven)。它是在用形界面的环境下,使得一切输入变化简单化。通常鼠标或热键的动作我们称之为事件(Event),而由鼠标或

39、热键引发的一连串程序的动作,称之为事件驱动(EventDriver)。而对事件进行处理程序或函数,我们称之为事件处理程序(EventHandler)。2.事件处理程序在JavaScript中对象事件的处理通常由函数(Function)担任。其基本格式与函数全部一样,可以将前面所介绍的所有函数作为事件处理程序。格式如下:Function事件处理名(参数表)事件处理语句集;事件驱动 lJavaScript事件驱动中的事件是通过鼠标或热键的动作引发的。它主要有以下几个事件:l(1)单击事件onClick当用户单击鼠标按钮时,产生onClick事件。同时onClick指定的事件处理程序或代码将被调用执

40、行。通常在下列基本对象中产生:button(按钮对象)checkbox(复选框)或(检查列表框)radio(单选钮)resetbuttons(重要按钮)submitbuttons(提交按钮)例:可通过下列按钮激活change()文件:在onClick等号后,可以使用自己编写的函数作为事件处理程序,也可以使用JavaScript中内部的函数。还可以直接使用JavaScript的代码等。例:Inputtype=buttonvalue=onclick=alert(这是一个例子);lonChange改变事件当利用text或texturea元素输入字符值改变时发该事件,同时当在select表格项中一个选

41、项状态改变后也会引发该事件。例:事件l(3)选中事件onSelect当Text或Textarea对象中的文字被加亮后,引发该事件。l(4)获得焦点事件onFocus当用户单击Text或textarea以及select对象时,产生该事件。此时该对象成为前台对象。l(5)失去焦点onBlur当text对象或textarea对象以及select对象不再拥有焦点、而退到后台时,引发该文件,他与onFocas事件是一个对应的关系。事件l(6)载入文件onLoad当文档载入时,产生该事件。onLoad一个作用就是在首次载入一个文档时检测cookie的值,并用一个变量为其赋值,使它可以被源代码使用。l(7)

42、卸载文件onUnload当Web页面退出时引发onUnload事件,并可更新Cookie的状态。范例范例l下例程序是一个自动装载和自动卸载的例子。即当装入HTML文档时调用loadform()函数,而退出该文档进入另一HTML文档时则首先调用unloadform()函数,确认后方可进入l下一个基于对象的JAVASCRIPT语言lJavaScript语言是基于对象的(Object-Based),而不是面向对象的(object-oriented)。之所以说它是一门基于对象的语言,主要是因为它没有提供象抽象、继承、重载等有关面向对象语言的许多功能。而是把其它语言所创建的复杂对象统一起来,从而形成一个

43、非常强大的对象系统。l虽然JavaScript语言是一门基于对象的,但它还是具有一些面向对象的基本特征。它可以根据需要创建自己的对象,从而进一步扩大JavaScript的应用范围,增强编写功能强大的Web文档。对象l一、对象的基础知识l1.对象的基本结构lJavaScript中的对象是由属性(properties)和方法(methods)两个基本的元素的构成的。前者是对象在实施其所需要行为的过程中,实现信息的装载单位,从而与变量相关联;后者是指对象能够按照设计者的意图而被执行,从而与特定的函数相联。对象l引用对象的途径l一个对象要真正地被使用,可采用以下几种方式获得:引用JavaScript内

44、部对象;由浏览器环境中提供;创建新对象。这就是说一个对象在被引用之前,这个对象必须存在,否则引用将毫无意义,而出现错误信息。从上面中我们可以看出JavaScript引用对象可通过三种方式获取。要么创建新的对象,要么利用现存的对象。有关对象操作语句 lJavaScript不是一纯面向对象的语言,它设有提供面向对象语言的许多功能,因此JavaScript设计者之所以把它你“基于对象”而不是面向对象的语言,在JavaScript中提供了几个用于操作对象的语句和关键字及运算符。l(1)For.in语句格式如下:For(对象属性名in已知对象名)说明:该语句的功能是用于对已知对象的所有属性进行操作的控制

45、循环。它是将一个已知对象的所有属性反复置给一个变量;而不是使用计数器来实现的。该语句的优点就是无需知道对象中属性的个数即可进行操作。例:下列函数是显示数组中的内容:FunctionshowData(object)for(varX=0;X30;X+)document.write(objecti);该函数是通过数组下标顺序值,来访问每个对象的属性,使用这种方式首先必须知道数组的下标值,否则若超出范围,则就会发生错误。而使For.in语句,则根本不需要知道对象属性的个数,见下:FunctionshowData(object)for(varpropinobject)document.write(obj

46、ectprop);使用该函数时,在循环体中,For自动将的属性取出来,直到最后为此l(2)with语句使用该语句的意思是:在该语句体内,任何对变量的引用被认为是这个对象的属性,以节省一些代码。withobject.所有在with语句后的花括号中的语句,都是在后面object对象的作用域的。l(3)this关键字this是对当前的引用,在JavaScript由于对象的引用是多层次,多方位的,往往一个对象的引用又需要对另一个对象的引用,而另一个对象有可能又要引用另一个对象,这样有可能造成混乱,最后自己已不知道现在引用的那一个对象,为此JavaScript提供了一个用于将对象指定当前对象的语句thi

47、s。l(4)New运算符虽然在JavaScript中对象的功能已经是非常强大的了。但更强大的是设计人员可以按照需求来创建自己的对象,以满足某一特定的要求。使用New运算符可以创建一个新的对象。其创建对象使用如下格式:Newobject=NEWObject(Parameterstable);其中Newobject创建的新对象:object是已经存在的对象;parameterstable参数表;new是JavaScript中的命令语句。如创建一个日期新对象newData=NewData()birthday=NewData(December12.1998)之后就可使NewData、birthday作

48、为一个新的日期对象了。对象属性的引用 l对象属性的引用可由下列三种方式之一实现:l(1)使用点(.)运算符university.Name=“云南省”university.city=“昆明市”university.Date=1999其中university是一个已经存在的对象,Name、City、Date是它的三个属性,并通过操作对其赋值。对象属性的引用l(2)通过对象的下标实现引用university0=“云南”university1=“昆明市”university2=1999通过数组形式的访问属性,可以使用循环操作获取其值。functionshowunievsity(object)for(v

49、arj=0;j2;j+)document.write(objectj)若采用For.in则可以不知其属性的个数后就可以实现:Functionshowmy(object)for(varpropinthis)docament.write(thisprop);对象的方法的引用 l在JavaScript中对象方法的引用是非常简单的。ObjectName.methods()实际上methods()=FunctionName方法实质上是一个函数。如引用university对象中的showmy()方法,则可使用:document.write(university.showmy()或:document.wri

50、te(university)如引用math内部对象中cos()的方法则:with(math)document.write(cos(35);document.write(cos(80);若不使用with则引用时相对要复杂些:document.write(Math.cos(35)document.write(math.sin(80)常用对象的属性和方法 lJavaScript为我们提供了一些非常有用的常用内部对象和方法。用户不需要用脚本来实现这些功能。这正是基于对象编程的真正目的。l在JavaScript提供了string(字符串)、math(数值计算)和Date(日期)三种对象和其它一些相关的方

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 生活休闲 > 生活常识

本站为文档C TO C交易模式,本站只提供存储空间、用户上传的文档直接被用户下载,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有。本站仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。若文档所含内容侵犯了您的版权或隐私,请立即通知得利文库网,我们立即给予删除!客服QQ:136780468 微信:18945177775 电话:18904686070

工信部备案号:黑ICP备15003705号-8 |  经营许可证:黑B2-20190332号 |   黑公网安备:91230400333293403D

© 2020-2023 www.deliwenku.com 得利文库. All Rights Reserved 黑龙江转换宝科技有限公司 

黑龙江省互联网违法和不良信息举报
举报电话:0468-3380021 邮箱:hgswwxb@163.com