《网页行为语言javas》由会员分享，可在线阅读，更多相关《网页行为语言javas（62页珍藏版）》请在金锄头文库上搜索。
1、第5章 网页行为语言JavaScript JavaScript是制作网页的行为（Behavior）语言之一。,5.1 JavaScript简介 脚本程序既可以在服务器端运行，也可以直接在浏览器端运行（称为客户端脚本）。 JavaScript是一种基于对象（Object）和事件驱动（Event Driven）的脚本语言。,5.2 把JavaScript加到网页中的方法,5.2.1 在HTML文档中嵌入脚本程序 JavaScript的脚本程序包括在HTML中，使之成为HTML文档的一部分。其格式为： JavaScript语言代码; JavaScript语言代码; 【例5-1】 需要提醒的是，在中的
2、程序代码有大、小写之分，例如将document.write()写成Document.write()，程序将无法正确执行。 【例5-2】,5.2.2 链接脚本文件 引用外部脚本文件的格式为： 脚本文件的扩展名为.js，内容是脚本，不能包含HTML标记。其格式为： JavaScript语言代码; / 注释 JavaScript语言代码; JavaScript语言代码; 【例5-3】,5.2.3 在标记内添加脚本 可以在HTML表单的输入标记符内添加脚本，以响应输入的事件。 【例5-4】,5.3 JavaScript的基本数据类型和表达式 JavaScript脚本语言同其他计算机语言一样，有它自身的
3、基本数据类型、运算符和表达式。,5.3.1 基本数据类型 JavaScript有4种基本的数据类型。 number（数值）类型。 string（字符）类型。 boolean（布尔）类型。 object（对象）类型。 JavaScript还有一个特殊的数据类型undefined（未定义）。,5.3.2 常量,1基本常量 （1）字符型常量 （2）数值型常量 （3）布尔型常量,2特殊常量 (1）空值 （2）控制字符,5.3.3 变量,1变量的命名,2变量的类型,3变量的声明 变量的声明和赋值语句var的语法为： var 变量名称1 = 初始值1 , 变量名称2 = 初始值2 ; 一个var可以声明多
4、个变量，其间用“,”分隔。,4变量的作用域,5.3.4 运算符和表达式 双目运算符格式如下： 操作数1 运算符 操作数2 1算术运算符 2字符串运算符 3比较运算符 4布尔运算符 5位运算符 6运算符的优先顺序,5.4 JavaScript的程序结构,5.4.1 简单语句,1赋值语句 格式为： 变量名 = 表达式 ;,2注释语句 单行注释语句的格式为： / 注释内容 多行注释语句的格式为： /* 注释内容 注释内容 */,3输出字符串 （1）用document对象的write()方法输出字符串 document对象的write()方法的功能是向页面内写文本，其格式为： document.wri
5、te(字符串1, 字符串2, ) ; （2）用window对象的alert()方法输出字符串 window对象的alert()方法的功能是弹出提示对话框，其格式为： alert(字符串) ; 其应用见例5-1。,4输入字符串 （1）用window对象的prompt()方法输入字符串 其格式为： prompt(提示字符串, 默认值字符串) ; var name=prompt(“请输入您的姓名：“, “) ; document.write(“您好！“+name) ; （2）用文本框输入字符串 【例5-5】 【例5-6】,5.4.2 程序控制语句 1条件语句 （1）if else语句 if else
6、语句的格式为： if (条件) 语句段1; else 语句段2; “条件”要用( )括起来。 【例5-7】,（2）switch语句 switch语句的格式为： switch (表达式) case 值1 : 语句段1; break; default : 缺省语句段; ,例如，下面程序段根据输入的水果英文名称i，给出水果的价格。 switch (i) case “Oranges“ : document.write(“Oranges are $0.59 a pound.“); break; case “Apples“ : document.write(“Apples are $0.32 a poun
7、d.“); break; case “Bananas“ : document.write(“Bananas are $0.48 a pound.“); break; case “Cherries“ : document.write(“Cherries are $3.00 a pound.“); break; default : document.write(“Sorry, we are out of “ + i + “.“); 【例5-8】,2循环语句 （1）for循环语句 for循环语句的格式为： for (初始化; 条件; 增量) 语句段; 【例5-9】 下面代码利用for循环自动显示标记
8、的各级标题： for(i=1; i本行是 “+i+“ 级标题“); ,（2）while循环语句 while循环语句的格式为： while (条件) 语句段; 例如，下面的while循环当n小于3时重复执行循环体。 n = 0 x = 0 while(n 3) n + x += n 【例5-10】,（3）do while语句 do while语句是while的变体，其格式为： do 语句段; while (条件) 例如，在下面程序中，do循环至少执行一次，并且重复执行直到i不再小于5。 do i+=1 document.write(i); while (i5);,（4）标号语句 label语句格
9、式为： 标号名称: 语句; （5）break语句 break语句的功能是无条件跳出循环结构或switch语句。 【例5-11】 （6）continue语句 continue语句的功能是结束本轮循环，跳转到循环的开始处，从而开始下一轮循环。 【例5-12】,5.4.3 函数,1函数的定义 JavaScript并不区分函数（Function）和过程（Procedure），在JavaScript中只有函数。 JavaScript也遵循先定义函数，后调用函数的规则。 定义函数的格式为： function 函数名(参数1, 参数2, ) 语句段; return 表达式; / return语句指明被返回的
10、值 【例5-13】,2函数的调用 （1）无返回值的调用 如果函数没有返回值或调用程序不关心函数的返回值，可用下面的格式调用定义的函数： 函数名(传递给函数的参数1, 传递给函数的参数2, ); （2）有返回值的调用 如调用程序需要函数的返回结果，则要用下面的格式调用定义的函数： 变量名=函数名(传递给函数的参数1, 传递给函数的参数2, ); 例如，result = multiple(10,20); 对于有返回值的函数调用，也可以在程序中直接利用其返回的值。例如，document.write(multiple(10,20)。,（3）在超链接标记中调用函数 当单击超链接时，可以触发调用函数。有两
11、种方法： 使用标记的onClick属性调用函数，其格式为： 热点文本 使用标记的href属性，其格式为： 热点文本 【例5-14】,（4）在装载网页时调用函数 有时希望在装载（执行）一个网页时仅执行一次JavaScript代码，这时可使用标记的onLoad属性，其代码形式为： function 函数名(参数表) 当网页装载完成后执行的代码; 网页的内容 【例5-15】,3全局变量与局部变量 【例5-16】,4JavaScript内置的函数 （1）escape():将字符转换成Unicode码 （2）eval():计算表达式的结果 。 （3）parseInt()和parseFloat():将字符
12、串转换成符点数、整数形式。 （4）isNaN():测试是(true)否(false)不是一个数字,5.5 基于对象的JavaScript语言,1对象 （1）对象的概念 JavaScript中的对象是由属性（properties）和方法（methods）两个基本的元素构成的。 用来描述对象特性的一组数据，也就是若干个变量，称为属性。 用来操作对象特性的若干个动作，也就是若干函数，称为方法。 在JavaScript中，可以使用的对象有： l JavaScript的内置对象 l 由浏览器根据Web页面的内容自动提供的对象 l 用户自定义的对象。 JavaScript中的对象名、属性名与变量名一样要区
13、分大小写。,（2）对象的使用 要使用一个对象，有下面3种方法： 引用JavaScript内置对象。 由浏览器环境中提供。 创建新对象。 一个对象在被引用之前必须已经存在。 （3）对象的操作语句 1）forin语句。forin语句的基本格式为： for(变量 in 对象) 语句段; 【例5-17】,2）with语句。with语句的基本格式为： with (对象) 语句段; 该语句的功能用于声明一个对象，代码块中的语句都被认为是对这一对象属性进行的操作。 3）this关键字。this用于将对象指定为当前对象。 4）new关键字。使用new可以创建指定对象的一个实例。其创建对象实例的格式为： 对象实
14、例名=new 对象名(参数表); 5）delete操作符。delete操作符可以删除一个对象的实例。其格式为： delete 对象名;,2对象的属性 对象属性的引用有3种方式。 （1）点（）运算符 把点放在对象实例名和它对应的属性之间，以此指向一个惟一的属性。属性的使用格式为： 对象名.属性名 = 属性值; 例如：一个名为person的对象实例，它包含了sex、name、age 3个属性，对它们的赋值可用如下代码： person.sex=“female“; person.name=“Jane“; person.age=18;,（2）对象的数组下标 通过“对象下标”的格式也可以实现对象的访问。在
15、用对象的下标访问对象属性时，下标是从0开始，而不是从1开始的。例如前面代码可改为： person0=“female“; person1=“Jane“; person2=18; 通过下标形式访问属性，可以使用循环操作获取其值。对上面的例子可用如下方式获取每个属性的值： function show_number(person) for(var i=0; i3; i+) document.write(personi); ,若采用forin语句，则不知其属性的个数也可以实现： function show_number(person) for(var prop in this) document.wri
16、te(thisprop); ,（3）通过字符串的形式实现 通过“对象字符串”的格式实现对象的访问： person“sex“=“female“; person“name“=“Jane“; person“age“=18;,3对象的事件 事件就是对象上所发生的事情。,4对象的方法 其格式为： 对象名.方法( ) 例如，引用person对象中已存在的一个方法howold()，则可使用： document.write(person.howold(); 如果引用math内部对象中sin()的方法，则： with(math) document.write(sin(30); document.write(sin(75); 若不使用with，则引用时
