《现代网页设计及网络建设技术 教学课件 ppt 作者 黄建华 第4章 JAVASCRIPT语言》由会员分享，可在线阅读，更多相关《现代网页设计及网络建设技术 教学课件 ppt 作者 黄建华 第4章 JAVASCRIPT语言（25页珍藏版）》请在金锄头文库上搜索。
1、第4章 JAVASCRIPT语言,4.1 脚本语言 4.2 JavaScript的组成 4.3 JavaScript流程控制语句 4.4 JavaScript函数 4.5 JavaScript内部对象 4.6 JavaScript应用 本章小节,兰州石化职业技术学院 黄建华,脚本语言学习要求,下一页,上一页,返回目录,本章通过JavaScript语言简介、程序组成和应用实例四个部分来介绍JavaScript语言应用方法。 了解JavaScript语言的用途，并与VBScript语言做了比较；在JavaScript应用部分介绍了JavaScript程序及编辑方法； 最后通过6个实例让读者可以直观
2、的了JavaScript语言的应用方法，并通过最后两个实例来说明JavaScript与VB script在程序实现功能上的不同。,兰州石化职业技术学院,4.1 脚本语言,下一页,上一页,返回目录,1脚本语言 脚本（Script）其实质就是一段用来完成某些特殊功能的程序。脚本既可以在服务器端运行，称为服务器端脚本如 ASP、PHP、JSP等；也可以直接在浏览器端运行，称为客户端脚本如VBScript、JavaScript等。 在ASP中通常采用VBScript 和JAVAcript两种脚本语言。熟悉Visual Basic读者一般采用VBScript，如果熟悉C、C+和JAVA语言的读者选择JA
3、VAcript较好。在ASP文件中可以采用多种脚本语言来实现编程。 2脚本语言的简介 （1）VBScript：VBScript是一个和 Basic语言密切相联系的脚本语言，VBScript是ASP默认的一种页面格式语言，编程相当简单，而且可以直接在HTML文件中嵌入使用。,兰州石化职业技术学院,4.1 脚本语言,下一页,上一页,返回目录,（2）JAVAScript：JAVAScript是一种基于对象和事件驱动并且具有安全性较好的脚本语言，是Sun、Netscape两公司共同开发的产品，可以开发客户端的应用小程序。JAVAScript是动态的，它可以直接对用户或客户输入作出响应，实现了网页和用户
4、之间实时动态、交互的关系，使网页包含更多活跃的元素和更加精彩的内容，而且它依赖浏览器本身而与操作环境无关，只要计算机能运行浏览器即可。 （3）Jscript：JScript是微软开发的，它和C语言相似，JScript应用于ASP，运行于服务器端，而JAVAScript是运行于客户端的。,兰州石化职业技术学院,4.2 JavaScript的组成,下一页,上一页,返回目录,1.JavaScript的数据类型、常量和变量 在JavaScript中，变量的类型没有限制，所有的数值都被认为是浮点数，同时JavaScrip也支持字符串。 常量是在程序中不变的量，如字符串、数字和日期等，也可以在程序中代表特
5、定的数值，从而方便了用户程序的开发。和其他编程语言一样，JavaScript采用变量存储数据，其运算符和C语言极为相似。在JavaScript中，可以不管变量的类型，都可以用Var 来定义所有变量，如Number（数值类型）、String（字符串类型）、Boolean（布尔类型）、Null（空值类型）以及Undefined和object。JavaScript有四种基本的数据类型，它们分别为： （1）数值类型：包括整数和实数。 （2）字符串类型：这个类型的数据需要用英文的双引号“或者单引号括起来。 （3）布尔类型：布尔只分True或者False两种。 （4）空值类型： null。,兰州石化职业技
6、术学院,4.2 JavaScript的组成,下一页,上一页,返回目录,变量的主要功能就是用来存储数据。它首先要求变量名必须以字母开头，中间可以是任何字母、数字和下划线的组合；其次变量名不能使用JavaScript语言本身所使用的固定关键字，比如var、JavaScript、document等不能来命名变量。 因为JavaScript使用的是弱类型定义，在定义一个常量或者变量的时候可以不指明它的数据类型，常量或者变量会自动根据所赋的值来选择最合适的数据类型，这一点大大简化了JavaScript的编程难度。 2.JavaScript运算符 JavaScript中有六种运算符，包括算术运算符、赋值运
7、算符、逻辑运算符、比较运算符、字符串运算符和位运算符。 （1）算术运算符：+、-、MOD（求余）、*、/（除）、%（取模）、+、-等。,兰州石化职业技术学院,4.2 JavaScript的组成,下一页,上一页,返回目录,在JavaScript中，加法有以下操作规则： 1） 数值和数值相加，结果为数值相加之和。 2）字符串和字符串相加，结果为两个字符串连接起来。 3）字符串和数字相加，则计算机先将数字转换为字符串再进行加法运算。 （2）逻辑运算符：&（逻辑与）、|（逻辑或）、!（逻辑非）等。 在逻辑运算中，对于数值变量或表达式，只要不为0，在进行逻辑运算时，就将其视为1（true）；如果为0，则
8、视为0（false）。 （3）比较运算符：、=、= =、！=（不等于）。 1）：计算运算符左边是否大于右边，大于结果为true，否则为false。,兰州石化职业技术学院,4.2 JavaScript的组成,下一页,上一页,返回目录,4）=： 计算运算符左边是否大于或等于右边，大于或等于结果为true，否则为false。 5）=： 测试运算符两边是否相等，相等结果为true，不相等则为false。 6）!=： 计算运算符两边是否不等，不相等结果为true，相等则为false。 参与比较的表达式均为数值时，遵循数值比较规则。 参与比较的表达式均为字符串时，遵循字符串比较规则。 参与比较的表达式一个
9、为字符，一个为数值时，则将字符串表达式转换为数值表达式再进行比较。经过运算符运算之后，返回布尔型值true（真）或false（假）。 （4）字符串运算符：+、& 用于连接两个字符串。 （5）位操作运算符： &（位与）、|（位或）、（位异或）、（位非）、（右移一位）、（右移位左边补零）等。,兰州石化职业技术学院,4.2 JavaScript的组成,下一页,上一页,返回目录,（6）赋值运算符：=、+=（加等于）、-=（减等于）、*=（乘等于）、 =（除等于）、 =（整除等于）、=（右移位等于）、=（右移位左边补零等于）等。 （7）条件运算符：?：。 大多数JavaScript运算符都是双目运算符，
10、即具有两个操作数的运算符，比较运算符是对符号两端的数据进行比较并返回布尔值，符号两端的数据类型要求一致；逻辑运算符是进行布尔型数据之间的运算功能符号，并且返回布尔值。通常用以下方式进行操作。 操作数1 运算符 操作数2,兰州石化职业技术学院,4.2 JavaScript的组成,下一页,上一页,返回目录,3JavaScript表达式 （1）在执行运算时，不同表达式的优先级顺序如下： 算术运算连接运算关系运算逻辑运算 （2）在所有运算中，括号最优先运算。在同一类型运算时，也有优先顺序，如逻辑运算符的优先级由高到低顺序为：！、 & 、，即先计算非，再计算与，最后为或计算。 （3）表达式是运算符和操作
11、数的组合。表达式通过求值确定表达式的值，这个值是对操作数实施运算符所确定的运算后产生的结果，结果最终为真或假之一。有些运算符将数值赋予一个变量名，而另一些运算符则可以用在其他表达式中 。,兰州石化职业技术学院,4.3 JavaScript流程控制语句,下一页,上一页,返回目录,JavaScript的控制程序流程的语句主要有： if语句；switch语句；for语句；while语句；dowhile语句；with语句等，现介绍常用的几种。 1条件语句（分支语句） 在JavaScript中提供了if语句、if else语句以及Select Case语句等三种条件语句来控制流程的执行顺序。 （1）if
12、 语句是最基本的条件语句，它的格式为： if（条件表达式） 功能语句段； 说明：若条件满足，执行语句段；若条件不满足，不执行该语句段，而转到功能语句段后面的程序往下执行。 （2）if else语句的格式为： if（条件表达式） 语句段1；,兰州石化职业技术学院,4.3 JavaScript流程控制语句,下一页,上一页,返回目录,Else 语句段2； 说明：若条件满足，执行语句段1，不执行该语句段2；若条件不满足，执行该语句段2，不执行该语句段1，然后往下执行其他语句。 （3） switch语句的格式如下： switch（(判断表达式条件） case value1: 语句段1;break； ca
13、se value2：语句段2; break； case value3：语句段3; break； case else：语句段n； 说明: switch case结构在语句块执行之前，对条件表达式语句先进行计算，根据表达式的计算结果与结构中的每个case的值进行比较，若相同，则执行与该case关联的语句段；若前N-1个均不满足时，执行case else语句段n后结束。,兰州石化职业技术学院,4.3 JavaScript流程控制语句,下一页,上一页,返回目录,2循环语句 循环语句用于在一定条件下反复执行某段代码的功能。在JavaScript中提供了许多种循环语句。 （1) for语句格式如下： fo
14、r（初始值；终值；增量） 语句段； 说明：For语句是一种计数循环，它的循环是在用户给定的计数范围内进行的。初始值参数代表初始化条件；终值参数代表终止条件；增量参数指定循环步长。循环中的程序代码将重复执行，直到循环结束。,兰州石化职业技术学院,4.3 JavaScript流程控制语句,下一页,上一页,返回目录,（2)while语句是另一种当型循环语句结构，格式如下： while（判断循环结束的条件表达式条件） 语句段； （3)do while语句是while语句的变形结构，格式如下： Do 语句段； while（判断循环结束的条件表达式条件）,兰州石化职业技术学院,4.3 JavaScript
15、流程控制语句,下一页,上一页,返回目录,几点说明： 1）条件 是前面所述的算术、关系和逻辑三种运算表达式，运算所得的布尔值来决定是否条件为真。条件为真时执行循环语句段；条件不为真时不执行循环语句段。 2）break语句 提供无条件跳出循环结构或switch语句的功能。 3）continue语句 作用是终止当前循环，跳转到循环的开始处继续下一轮循环执行。 break语句和continue语句既可以单独使用，也可以与语句标号一起使用。,兰州石化职业技术学院,4.4 JavaScript函数,下一页,上一页,返回目录,JavaScript是面向对象的语言，采用事件驱动的方法。函数和事件很相似，但它不
16、是由对象的事件触发的，而是通过调用函数来执行函数内的代码，并把执行的结果返回。 函数是已命名的代码功能块，代码块中的语句被作为一个整体引用和执行。在使用函数之前，必须先定义函数，后使用函数。函数定义通常放在HTML文档头中，但也可以放在其他位置，建议最好放在文档头中，这样就可以确保先定义后使用。定义函数的格式如下： function 函数名（参数1，参数2，） 语句段； return 表达式； 函数名是调用函数时引用的名称，参数是调用函数时接收传入数值的变量名。花括号中的语句是函数的执行语句，当函数被调用时执行，如果需要函数返回值，可以使用return语句，需要返回的值应放在return之后。,兰州石化职业技术学院,4.5 JavaScript内部对象,下一页,上一页,返回目录,对象就是客观世界中存在的特定实体，JavaScript中的对象是由属性和方法两个基本元素构成。属性是对象在实施其所需要的行为过程中，实现信息的装载，因此与变量关联；方法是对象能够按
