《网页设计9课程学习.pptx》由会员分享,可在线阅读,更多相关《网页设计9课程学习.pptx(48页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、会计学1网页网页(wn y)设计设计9第一页,共48页。熟练掌握熟练掌握熟练掌握熟练掌握JavaScriptJavaScript在在在在HTMLHTML中的使用方法。中的使用方法。中的使用方法。中的使用方法。了解关键字和标识符。了解关键字和标识符。了解关键字和标识符。了解关键字和标识符。掌握掌握掌握掌握JavaScriptJavaScript常用常用常用常用(chn(chn yn yn)的数据类型。的数据类型。的数据类型。的数据类型。熟悉常量和变量。熟悉常量和变量。熟悉常量和变量。熟悉常量和变量。熟悉运算符和表达式。熟悉运算符和表达式。熟悉运算符和表达式。熟悉运算符和表达式。掌握掌握掌握掌握J
2、avaScriptJavaScript的几种流程控制语句。的几种流程控制语句。的几种流程控制语句。的几种流程控制语句。掌握函数的定义方法,并学会写函数。掌握函数的定义方法,并学会写函数。掌握函数的定义方法,并学会写函数。掌握函数的定义方法,并学会写函数。了解了解了解了解JavaScriptJavaScript中常用中常用中常用中常用(chn(chn yn yn)的一些系统函数。的一些系统函数。的一些系统函数。的一些系统函数。第2页/共48页第二页,共48页。在该任务的程序中,程序的主体为黑色加粗部分,黑色加粗显示的代码表示在该任务的程序中,程序的主体为黑色加粗部分,黑色加粗显示的代码表示在该任
3、务的程序中,程序的主体为黑色加粗部分,黑色加粗显示的代码表示在该任务的程序中,程序的主体为黑色加粗部分,黑色加粗显示的代码表示JavaScriptJavaScript程序插入程序插入程序插入程序插入HTMLHTML文件中。文件中。文件中。文件中。JavaScriptJavaScript文件不能单独使用,这在后面会进行介绍。文件不能单独使用,这在后面会进行介绍。文件不能单独使用,这在后面会进行介绍。文件不能单独使用,这在后面会进行介绍。分析该任务,可以看出,程序中运用了分析该任务,可以看出,程序中运用了分析该任务,可以看出,程序中运用了分析该任务,可以看出,程序中运用了JavaScriptJav
4、aScript中的程序流程控制语句中的程序流程控制语句中的程序流程控制语句中的程序流程控制语句(y(y j)ifelsej)ifelse、时间函数、时间函数、时间函数、时间函数Date()Date()、getHours()getHours()等知识,实现了该任务。等知识,实现了该任务。等知识,实现了该任务。等知识,实现了该任务。知识讲解知识讲解知识讲解知识讲解第3页/共48页第三页,共48页。本本章章目目录录JavaScriptJavaScript概述概述概述概述9.19.1基础语法基础语法基础语法基础语法9.29.2流程控制语句流程控制语句流程控制语句流程控制语句9.39.3函数函数函数函数
5、9.49.4思考与练习思考与练习思考与练习思考与练习第4页/共48页第四页,共48页。JavaScript概述概述9.1第5页/共48页第五页,共48页。9.1.29.1.2JavaScriptJavaScript在在在在HTMLHTML中的使用中的使用中的使用中的使用9.1.19.1.1JavaScriptJavaScript导读导读导读导读9.1.39.1.3JavaScriptJavaScript注释注释注释注释第6页/共48页第六页,共48页。第7页/共48页第七页,共48页。9.1.19.1.1JavaScriptJavaScript导读导读(do d)(do d)JavaScrip
6、t在网页中的用处很多,它可以对事件作出响应,可以将JavaScript设置为当某事件发生时才被执行,例如,页面(y min)载入完成或者用户单击某个HTML元素时。JavaScript可以读写HTML元素,在数据被提交到服务器之前,JavaScript还可被用来验证这些数据。JavaScript可被用来检测访问者的浏览器,并根据所检测到的浏览器,为这个浏览器载入相应的页面(y min)。JavaScript可被用来创建cookies,还可被用来存储和取回位于访问者计算机中的信息等。第8页/共48页第八页,共48页。9.1.29.1.2JavaScriptJavaScript在在HTMLHTML
7、中的使用中的使用(shyng)(shyng)JavaScriptJavaScript放置在放置在放置在放置在标签中标签中标签中标签中JavaScriptJavaScript放置在放置在放置在放置在标签中标签中标签中标签中1)在)在HTML文件中的文件中的标签中编写标签中编写2)在单独的)在单独的js文件中编写,然后在文件中编写,然后在HTML文件中引用文件中引用3)将程序代码作为某个元素的事件属性值或超链接的)将程序代码作为某个元素的事件属性值或超链接的href属性值属性值第9页/共48页第九页,共48页。9.1.39.1.3JavaScriptJavaScript注释注释(zhsh)(zhs
8、h)可以解释程序某些语句的作用和功能,使程序更易于理解可以解释程序某些语句的作用和功能,使程序更易于理解可以解释程序某些语句的作用和功能,使程序更易于理解可以解释程序某些语句的作用和功能,使程序更易于理解在在在在JavaScriptJavaScript中,为程序添加注释可以起到两种作用:中,为程序添加注释可以起到两种作用:中,为程序添加注释可以起到两种作用:中,为程序添加注释可以起到两种作用:可以使用注释来屏蔽某些暂时不用的语句,使浏览器对其暂时忽略,等到需要时,再取消注释,这些语句就会重新发挥作用可以使用注释来屏蔽某些暂时不用的语句,使浏览器对其暂时忽略,等到需要时,再取消注释,这些语句就会
9、重新发挥作用可以使用注释来屏蔽某些暂时不用的语句,使浏览器对其暂时忽略,等到需要时,再取消注释,这些语句就会重新发挥作用可以使用注释来屏蔽某些暂时不用的语句,使浏览器对其暂时忽略,等到需要时,再取消注释,这些语句就会重新发挥作用第10页/共48页第十页,共48页。基础语法基础语法9.2第11页/共48页第十一页,共48页。9.2.29.2.2数据类型数据类型数据类型数据类型9.2.19.2.1关键字和标识符关键字和标识符关键字和标识符关键字和标识符9.2.39.2.3变量变量变量变量9.2.49.2.4运算符运算符运算符运算符第12页/共48页第十二页,共48页。9.2.19.2.1关键字和标
10、识符关键字和标识符关键字关键字标识符标识符第13页/共48页第十三页,共48页。1.关键字关键字9.2.19.2.1关键字和标识符关键字和标识符第14页/共48页第十四页,共48页。2.标识符标识符9.2.19.2.1关键字和标识符关键字和标识符所谓标识符就是一个名称。在JavaScript中,标识符用来命名变量和函数,或者(huzh)用做JavaScript代码中某些循环的标签。在JavaScript中,标识符的命名规则和Java以及其他许多语言的命名规则相同,第一个字符必须是字母、下划线或美元符号($),其后的字符可以是字母、数字、下划线或美元符号等。数字不允许作为首字符出现,以便Java
11、Script能轻易地区分开标识符和数字。第15页/共48页第十五页,共48页。9.2.29.2.2数据类型数据类型整型整型布尔型布尔型字符串字符串JavaScript允许使用3种基础的数据类型整型整型数组数组对象对象还支持两种复合的数据类型第16页/共48页第十六页,共48页。1.数值数值(shz)类型类型9.2.29.2.2数据类型数据类型1)整数)整数2)浮点数)浮点数4)特殊值)特殊值3)内部常量)内部常量第17页/共48页第十七页,共48页。2.字符串类型字符串类型(lixng)9.2.29.2.2数据类型数据类型第18页/共48页第十八页,共48页。第19页/共48页第十九页,共48
12、页。未定义数据类型undefined,表示一个未定义的值在变量(binling)被创建后,未给该变量(binling)赋予以前所具有的值。对于数字,未定义数值表示为NaN;对于字符串,未定义数值表示为undefined;对于逻辑数值,未定义数值表示假。Null值在JavaScript中是一个特殊类型的值,表示一个空值,即没有值,而不是0。4.其他其他(qt)类型类型9.2.29.2.2数据类型数据类型第20页/共48页第二十页,共48页。9.2.39.2.3变量变量(binling)(binling)1.变量的命名变量的命名2.变量的声明与赋值变量的声明与赋值3.变量的作用域变量的作用域第21
13、页/共48页第二十一页,共48页。在JavaScript中,变量的命名(mng mng)规则如下。(1)必须以字母或下划线开头,中间可以是数字、字母或下划线。(2)变量名不能包含空格、加号、减号等符号。(3)不能使用JavaScript中的关键字。(4)变量名严格区分大小写。9.2.39.2.3变量变量(binling)(binling)1.变量的命名变量的命名第22页/共48页第二十二页,共48页。在JavaScript中,变量在使用前需要先声明,所有的JavaScript变量都用关键字var声明,其语法格式如下:var 变量名;在声明变量的同时也可以对变量进行赋值,例如:var a,b,c
14、=1;表示(biosh)声明变量a、b、c,同时对c赋值为1。如果只声明变量,未对其赋值,则其默认值为undefined。9.2.39.2.3变量变量(binling)(binling)2.变量的声明与赋值变量的声明与赋值第23页/共48页第二十三页,共48页。变量的作用域是指某变量在程序(chngx)中的有效范围,即程序(chngx)定义该变量的区域。JavaScript中的变量根据其作用域可以分为两种:全局变量和局部变量。全局变量是定义在所有函数之外,作用于整个程序(chngx)的变量;局部变量是定义在函数体内,只作用于函数体的变量,函数的参数也是局部变量,它只在函数内部起作用。9.2.3
15、9.2.3变量变量(binling)(binling)3.变量的作用域变量的作用域第24页/共48页第二十四页,共48页。9.2.49.2.4运算符运算符构成构成(guchng)计算机语言的基本要素计算机语言的基本要素常量常量常量常量变量变量变量变量运算符运算符运算符运算符表达式表达式表达式表达式第25页/共48页第二十五页,共48页。单目运算符单目运算符单目运算符单目运算符双目运算符双目运算符双目运算符双目运算符多目运算符多目运算符多目运算符多目运算符按操作数数目可以分为按操作数数目可以分为9.2.49.2.4运算符运算符第26页/共48页第二十六页,共48页。9.2.49.2.4运算符运算
16、符逻辑运算符逻辑运算符 算术运算符算术运算符比较运算符比较运算符按运算符按运算符类型分类类型分类位操作运算符位操作运算符 赋值运算符赋值运算符条件运算符条件运算符字符串运算符字符串运算符字符串运算符字符串运算符第27页/共48页第二十七页,共48页。流程控制语句流程控制语句9.3第28页/共48页第二十八页,共48页。9.3.29.3.2条件判断条件判断条件判断条件判断switchswitch语句语句语句语句9.3.19.3.1条件语句条件语句条件语句条件语句9.3.49.3.4其他语句其他语句其他语句其他语句9.3.39.3.3whilewhile循环控制语句循环控制语句循环控制语句循环控制
17、语句第29页/共48页第二十九页,共48页。9.3.19.3.1条件条件(tiojin)(tiojin)语句语句条件语句条件语句条件语句条件语句1.简单简单if语句语句4.if语句的嵌套语句的嵌套3.ifelse ifelse ifelse语句语句2.ifelse语句语句第30页/共48页第三十页,共48页。switch语句用于将一个表达式的结果同多个(du)值进行比较,并根据比较结果来选择执行哪条语句。语法格式如下:switch(表达式)case 整型常量值1:程序语句1;break;case 整型常量值2:程序语句2;9.3.19.3.1条件条件(tiojin)(tiojin)语句语句第3
18、1页/共48页第三十一页,共48页。break;case 整型常量值n:程序(chngx)语句n;break;default:程序(chngx)语句n+1;break;9.3.19.3.1条件条件(tiojin)(tiojin)语句语句第32页/共48页第三十二页,共48页。9.3.39.3.3whilewhile循环控制循环控制(kngzh)(kngzh)语句语句1.while1.while语句语句语句语句2.dowhile2.dowhile语句语句语句语句3.for3.for语句语句语句语句4.forin4.forin语句语句语句语句循环语句循环语句循环语句循环语句第33页/共48页第三十
19、三页,共48页。9.3.49.3.4其他其他(qt)(qt)语句语句条件语句条件语句条件语句条件语句1.break语句语句4.异常处理语句异常处理语句3.return语句语句2.continue语句语句第34页/共48页第三十四页,共48页。函数函数9.4第35页/共48页第三十五页,共48页。9.4.29.4.2函数的调用函数的调用函数的调用函数的调用9.4.19.4.1函数的定义函数的定义函数的定义函数的定义9.4.39.4.3全局变量与局部变量全局变量与局部变量全局变量与局部变量全局变量与局部变量9.4.49.4.4JavaScriptJavaScript内置的函数内置的函数内置的函数内
20、置的函数第36页/共48页第三十六页,共48页。9.4.19.4.1函数函数(hnsh)(hnsh)的定义的定义所谓函数是指有返回值的对象或对象的方法。常见的函数有如下几种:所谓函数是指有返回值的对象或对象的方法。常见的函数有如下几种:全局函数,即全局对象中的方法全局函数,即全局对象中的方法自定义函数自定义函数构造函数,如构造函数,如Array(),能构造一个数组,能构造一个数组第37页/共48页第三十七页,共48页。JavaScript并不区分函数(function)和过程(procedure),在JavaScript中只有函数。JavaScript也遵循函数的“先定义,后调用”的规则。函数
21、由关键字function、函数名、参数以及(yj)置于花括号中需要执行的一段语句组成。函数的定义格式如下:function 函数名(参数1,参数2,)语句段;return 表达式;/return语句指明被返回的值,如果不需要,可以省略9.4.19.4.1函数函数(hnsh)(hnsh)的定义的定义第38页/共48页第三十八页,共48页。9.4.29.4.2函数函数(hnsh)(hnsh)的调用的调用装载网页时调用函数有返回值的调用无返回值的调用241 在超链接标记中调用函数3第39页/共48页第三十九页,共48页。第40页/共48页第四十页,共48页。如果在函数之外声明了一个变量,则页面上的所
22、有(suyu)函数都可以访问该变量。这些变量的生存期从声明它们之后开始,到页面关闭时结束。如果在函数中定义了与全局变量同名的局部变量,则在该函数中且位于该变量定义之后的脚本代码使用的是局部变量,而不是全局变量。因为此时,全局变量被局部变量所覆盖,不再起作用。9.4.39.4.3全局变量与局部变量全局变量与局部变量第41页/共48页第四十一页,共48页。9.4.49.4.4JavaScriptJavaScript内置的函数内置的函数(hnsh)(hnsh)几几个个常用系常用系统函函数数1.parseInt()1.parseInt()和和和和parseFloat()parseFloat()函数函数
23、函数函数2.escape()2.escape()和和和和unescape()unescape()函数函数函数函数3.encodeURI()3.encodeURI()和和和和decodeURI()decodeURI()函数函数函数函数4.isNaN()4.isNaN()函数函数函数函数(1)parseInt()函数将一个字符串指定的进制转换成一个整数函数将一个字符串指定的进制转换成一个整数(2)parseFloat()函数将一个字符串转化成对应的浮点数()函数将一个字符串转化成对应的浮点数第42页/共48页第四十二页,共48页。思考与练习思考与练习第43页/共48页第四十三页,共48页。在购物网
24、站中,对顾客购买的东西都要进行价格计算。这些计算有些在购物网站中,对顾客购买的东西都要进行价格计算。这些计算有些在购物网站中,对顾客购买的东西都要进行价格计算。这些计算有些在购物网站中,对顾客购买的东西都要进行价格计算。这些计算有些(y(y uxi)uxi)比较复杂,如进行不同时间段的打折计算,或根据团购与否给予不同的价钱,但计算起来,也不外乎加、减、乘、除这几种基本运算。下面设计一个简单的计算器,进行这比较复杂,如进行不同时间段的打折计算,或根据团购与否给予不同的价钱,但计算起来,也不外乎加、减、乘、除这几种基本运算。下面设计一个简单的计算器,进行这比较复杂,如进行不同时间段的打折计算,或根
25、据团购与否给予不同的价钱,但计算起来,也不外乎加、减、乘、除这几种基本运算。下面设计一个简单的计算器,进行这比较复杂,如进行不同时间段的打折计算,或根据团购与否给予不同的价钱,但计算起来,也不外乎加、减、乘、除这几种基本运算。下面设计一个简单的计算器,进行这4 4种基本运算。种基本运算。种基本运算。种基本运算。任务扩展任务扩展任务扩展任务扩展制作购物网站中的简易计算器制作购物网站中的简易计算器制作购物网站中的简易计算器制作购物网站中的简易计算器第44页/共48页第四十四页,共48页。动动手动动手动动手动动手一、填空题一、填空题1.在一个在一个HTML文档中,使用文档中,使用_标签嵌入标签嵌入J
26、avaScript代码。代码。2.JavaScript是一种是一种_语言,其源代码不经过编译,而是在运行时被语言,其源代码不经过编译,而是在运行时被“翻译翻译”,因此被称为脚本式语言。,因此被称为脚本式语言。3.在在JavaScript中,变量在使用前需要先声明,所有的中,变量在使用前需要先声明,所有的JavaScript变量都用关键字变量都用关键字_声明。声明。4.forin循环语句和循环语句和for循环语句十分相似,循环语句十分相似,forin语句用来遍历对象的每一个语句用来遍历对象的每一个_,每次都将属性名作为字符串保存,每次都将属性名作为字符串保存(bocn)在变量里。在变量里。5.在
27、在JavaScript中,参数之间必须用中,参数之间必须用_分隔。分隔。第45页/共48页第四十五页,共48页。动动手动动手动动手动动手二、简答题二、简答题1.JavaScript有哪些作用?有哪些作用?2.简述全局变量和局部变量的区别。简述全局变量和局部变量的区别。三、练习题三、练习题1.将一个将一个gif图像显示为图像显示为44的阵列。的阵列。2.编写一个函数,在页面上输出编写一个函数,在页面上输出11 000所有能同时被所有能同时被3,5,7整除整除(zhngch)的整数,并要求每行显示的整数,并要求每行显示6个这样的数。个这样的数。3.设计一个表单,放入两个按钮,单击它们时将显示不同的问候语。设计一个表单,放入两个按钮,单击它们时将显示不同的问候语。第46页/共48页第四十六页,共48页。第47页/共48页第四十七页,共48页。感谢您的观看感谢您的观看(gunkn)!第48页/共48页第四十八页,共48页。