网页设计PPT第3章

1、第3章 JavaScript语言1 JAVASCRIPT语言简介2JAVASCRIPT编程基础3基于对象的JAVASCRIPT语言4 JAVASCRIPT程序实例1 JavaScript语言简介 JavaScript是一种基于对象（Object）和事件驱动（Event Driven）并具有安全性能的脚本语言。使用它的目的是与HTML超文本标记语言、Java语言（Java小程序）一起实现在一个Web页面中链接多个对象，与Web客户交互作用，从而可以开发客户端的应用程序等。它是通过嵌入在标准的HTML语言中实现的。 JavaScript的基本特点 JavaScript是一种脚本编写语言 基于对象的

2、语言 简单性 安全性 动态性 跨平台性 在HTML文件中嵌入JavaScript代码 将JavaScript脚本加入HTML文档的方法为： JavaScript编程基础 基本数据类型 表达式和运算符 JavaScript程序控制流程 函数 事件驱动及事件处理基本数据类型 在JavaScript中有六种数据类型：数值number、字符串string、布尔型Boolean、对象object、空值null和未定义undefined。 在JavaScript的基本类型中的数据可以是常量，也可以变量。由于JavaScript采用弱变量类型的形式，因而一个数据变量不必首先作声明，而是在使用或赋值时确定其数

3、据的类型的。 表达式和运算符 运算符是完成操作的一系列符号，在JavaScript中有算术运算符、字符串运算符、比较运算符和逻辑布尔运算符等。 JavaScript中的算术运算符有单目运算符和双目运算符。 单目运算符有：-（按位取反）、（按位取补）、+（递加1）、-（递减1）。 双目运算符有：+（加）、-（减）、*（乘）、/（除）、%（求余）、|（按位或）、&(按位与)、（右移）、（右移，零填充）。 字符串运算符“+”用于连接两个字符串。例如，“123”+“456”的结果为“123456”。 比较运算符的基本操作过程是，首先对它的操作数进行比较，然后再返回一个true或False值，有6个比较

4、运算符: (大于)、=(大于等于)、=(等于)、!=(不等于)。 逻辑运算符有！（逻辑非）、&（逻辑与）、|（逻辑或）。 JavaScript程序控制流程 if else语句的基本格式为： if（条件） 语句段； else 语句段； if语句的嵌套结构为： if（条件1）语句；else if （条件2）语句；else if（条件3）语句；else 语句n； switch语句的一般格式为：switch (expression)case label1: 语句段1；case label2: 语句段2；case label3: 语句段3；.default: 语句段n； 循环语句 for循环语句的基本格

5、式为： for（初始化；条件；增量） 语句集； while循环语句的基本格式为：while（条件）语句集； break和continue语句 对象操作语句 with语句的基本结构为：with (对象名称)执行语句 with语句的作用是这样的：如果想使用某个对象的许多属性或方法时，只要在with语句的（）中写出这个对象的名称，然后在下面的执行语句中直接写这个对象的属性名或方法名就可以了。 new语句是一种对象构造器，可以用new语句来定义一个新对象。其基本方法为： 新对象名称 new 真正的对象名 for.in语句的基本格式为：for (变量 in 对象或数组)语句 for.in语句的功能是用于

6、对已知对象的所有属性进行操作的控制循环。它是将一个已知对象的所有属性反复赋值给一个变量，而不是使用计数器来实现的。 函数 JavaScript中函数定义的基本格式为：Function 函数名 （参数1,参数2，）函数体； Return 表达式； 函数调用的一般形式为：函数名（实参表列）事件驱动及事件处理 JavaScript是基于对象（object-based）的语言，其基本特征就是采用事件驱动（event-driven）。通常鼠标或热键的动作我们称之为事件（Event），而由鼠标或热键引发的一连串程序的动作，称之为事件驱动（Event Driver），而对事件进行处理的程序或函数，我们称之为

7、事件处理程序（Event Handler）。 在JavaScript中对象事件的处理通常由函数（Function）担任。其基本格式与函数全部一样，格式如下：function 事件处理名（参数表）事件处理语句集； JavaScript事件驱动中的事件主要有以下几种： 单击事件onClick onChange改变事件 选中事件onSelect 获得焦点事件onFocus 失去焦点onBlur 载入文件onLoad 卸载文件onUnload 鼠标悬停onMouseOver 鼠标移离onMouseOut 基于对象的JavaScript语言 JavaScript中的对象是由属性(properties)和

8、方法(methods)两个基本的元素的构成的。属性是对象的信息的装载单位，从而与变量相关联；方法是指对象能够按照设计者的意图而被执行，从而与特定的函数相联。 对象属性的引用可以采用这样的方法：对象名称.属性名称。 在JavaScript中对象方法的引用是非常简单的。采用格式为：对象名称.方法名称 常用对象的属性和方法 在JavaScript提供了math（数值计算）、string（字符串）和Date（日期）三种内部对象，为编程人员快速开发强大的脚本程序提供了非常有利的条件。 Math对象是一个静态对象，它主要提供除加、减、乘、除以外的一些数学运算，如对数、平方根、三角函数等的计算 。 Math

9、对象的主要方法有： abs(value)：求数值value的绝对值。sin(value)、 cos(value) ：求数值value的正弦值、余弦值。tan(value)：求数值value的正切值。asin(value)、acos(value)、atan(value)log(value)：求数值value以e(2718)为底的自然对数值，输入的参数值value一定要大于零，输出的值是一个浮点数。exp(value)：返回e的value次方值。ceil(value) ：返回一个大于value的最小整数，即无条件地进位小数。floor(value)：返回一个小于value值的最大整数，即无条件舍去

10、小数。round(value)：对value的小数进行四舍五入。random() ：返回一个0至1（不等于1）之间的随机数。sqrt(value)：求数值value的平方根。串对象 在JavaScript中，处理字符串的对象是string对象，所有与字符串相关的函数都纪录在此对象中。串对象String也是一个内部静态对象。 串对象只有一个属性，即length。它表明了字符串中的字符个数，包括所有符号。 在JavaScript脚本语言中，不管是中文字还是英文字母，其长度均为1，并不像我们通常认为的那样，因为中文字占了两个字节，所以长度是2。 string对象的方法可以大致分为两类：一类是关于字符

11、串的运算，如字符串的搜索及字符串转换等，另一类则是字符串的显示处理，如字符串在Web页面中的显示字体大小、字体颜色等。其主要方法如下：anchor（）：产生一个书签名称(anchor)以作超级链接用。anchor函数设定的书签名称，另一个函数link设定的URL地址。Anchor的访问方法为 string.anchor(anchorName)。link（）：产生一个超级链接，相当于设定的URL地址。其引用方法为string. Link（URL）。big（）：将字体加大一号，与.标记作用相同。small（）：将字体减小一号，与.标记作用相同。bold（）：使字体加粗，与.标记作用相同。itali

12、cs（）：使字体成为斜体字，与.标记作用相同。fixed（）：将字体设定为固定宽度字体，与.标记作用相同。strike（）：在文本的中间加一条横线，与.标记作用相同。blink（）：使字符串闪烁，与.标记作用相同。sup（）：显示字符串为上标字(superscript)。sub（）：显示字符串为下标字(subscript)。fontcolor（）：设定字体颜色，与标记作用相同。其引用格式为string. Fontcolor（颜色代码）。fontsize（）：设定字体大小，与标记作用相同。其引用格式为string. Fontsize（n），n的值为17之一。charAt（）：返回字符串中指定的某

13、个字符。indexOf（）：返回一个子字符串在字符串中第一次出现的字符左索引。其引用格式为string.indexOf（character, fromIndex），即从指定fromIndex位置开始（其默认值为从字符串的第一个字符开始）搜索character在字符串string中第一次出现的位置。若欲寻找的子字符串character不在字符串中出现时，其返回值是-1，否则是0到（字符串长度-1）之间的一个数字。lastIndexOf（）：LastIndexOf（）方法与IndexOf（）方法的格式和功能很类似，只是LastIndexOf（）方法则是由字符串的最后一个字符开始往前搜索（从右向左）

14、。substring（）：返回字符串中指定的几个字符。其引用格式为string.substring（start，end），即将字符串中从start开始到end的字符（不包括end位置的字符）全部返回。toLowerCase（）：将字符串的大写字母全部变成小写字母，而小写的字母则维持不变。toUpperCase（）：将字符串的小写字母全部变成大写字母，而大写的字母则维持不变。日期时间对象Date 日期及时间对象是一个动态对象，也就是说Date对象的变量在使用前，必须先利用New运算符声明该变量成为一个Date对象，接下来才可对该变量作运算。 Date对象没有提供可以直接访问的属性，只有获取和设置

15、日期和时间的方法。 获取日期和时间的方法有： getYear(): 返回年数。返回值以1900年为基数，例如1999年为99。 getMonth():返回当月号数，值为011。其中0表示1月、1表示2月、.、11表示12月。 getDate(): 返回当日号数，值为131。 getDay():返回星期几，值为06，其中0表示星期日、1表示星期一、.、6表示星期六。 getHours():返回小时数，值为023。 getMintes(:返回分钟数，值为059。 getSeconds():返回秒数，值为059。 getTime() : 返回系统时间。 设置日期和时间的方法有： setYear()：设置年 setDate():设置当日号数 setMonth():设置当月份数 setHour