MJavaScript基础.ppt

1 JavaScript基础 2 本章目标 l理解什么是 JavaScript l如何将 JavaScript 嵌入到 HTML 中 l理解变量、数据类型和运算符 l掌握判断与循环语句 l了解对象的常用方法 l掌握自定义函数的书写 3 什么是JavaScript lJavaScript 是一种脚本语言 l提供用户交互 l动态更改内容 l数据验证 4 JavaScript简介 lJavaScript主要增加页面的互动性。 JavaScript和Java是两种完全不同的东西，只 是名称有些相似。 B/S结构中Java运行在服务端，JavaScript运 行在客户端。 JavaScript本质是一个文档，所以可以使用文 本编辑器来编写JavaScript代码。最简单使用 记事本编辑。 5 将JavaScript嵌入网页 l可以将 JavaScript 语句插入 HTML 文档， 方式 如下： l使用 标签将语句嵌入文档 l将 JavaScript 源文件链接到 HTML 文档中 6 使用 Script 标签 JavaScript 代码 document.write(“欢迎来到 JavaScript 世界“); 尽情享受学习的快乐! 脚本代码 设置语言 7 使用外部 JS 文件 l 外部 JavaScript 文件可以链接到 HTML 文档中 l script 标签的 src（源文件）属性可用于包括此外部 文件 8 使用外部 JS 文件 JavaScript 代码 (test.htm) 使用外部文件 以上文本是通过访问外部 JavaScript 文件显示 document.write(“喂！你好吗?“) JavaScript 代码 (test.js ) 9 变量 l变量名必须以字母或下划线（“_“）开头 l变量可以包含数字、从 A 至 Z 的大小写字母 lJavaScript 区分大小写，即变量 myVar、 myVAR 和 myvar 是不同的变量 10 声明变量 var a; “var” 用于声明变量的关键字 “a” 变量名 var x, y, z = 10; var a= 10; 同时声明和初始化变量 a = 10; 声明变量 声明多个变量 赋值 11 数据类型 数据类类型说说 明示 例 数字型整数或实数487, 25.95 布尔型执行逻辑运算true或 false 字符串型一组字符“Hello” 空特殊关键字，表示不存在的值 。 null 12 运算符 l运算符对一个或多个变量或值（操作数）进行运 算，并返 回一个新值 l根据所执行的运算，运算符可分为以下类别： l算术运算符 l比较运算符 l逻辑运算符 13 运算符 运算 符 说 明示 例 +加a = 5 + 8 -减a = 8 - 5 /除a = 20 / 5 *乘a = 5*19 %取模两个数相除的余数10 % 3 = 1 +一元自加。该运算符带一 个操作数，将操作数的值 加 1。返回的值取决于 + 运算符位于操作数的 前面或是后面 +x将返回 x 自 加运算后的值。 x+ 将返回 x 自 加运算前的值 - -一元自减。该运算符只带 一个操作数。返回的值取 决于 - 运算符位于操作数 的前面或是后面 -x 将返回 x 自 减运算后的值。 x- 将返回 x 自 减运算前的值 14 关系运算符 运算符说说 明示 例 = 等于。 如果两个操作数相等，则返回真。 a = = b !=不等于。 如果两个操作数不相等，则返回真。 var2 != 5 大于。 如果左边的操作数大于右边的操作数 ，则返回真。 var1 var2 =大于等于。如果左边的操作数大于或 等于右边的操作数，则返回真。 var1 = 5 var1 = var2 15 逻辑运算符 运算符值值说说 明 与 ( 语法： if 语句 如果要执行多个语句，必须将这些语句放在一对大括号 ( ) 内。 但如果只要执行一个语句，则可以省略大括号 17 if else 语句 if(条件) /JavaScript代码; else /JavaScript代码; Ifelse.语句的语法 ： 18 if (条件1) if (条件2) /JavaScript代码; 嵌套if语句语法： 嵌套 if 语句 19 switch (表达式) case 表达式: . case 表达式: . case 表达式: . case 表达式: . default:. 语法： Switch结构 20 /You will receive a different greeting based /on what day it is. Note that Sunday=0, /Monday=1, Tuesday=2, etc. var d=new Date() theDay=d.getDay() switch (theDay) case 5: document.write(“Finally Friday”) ; break ; case 6: document.write(“Super Saturday“) ;break ; case 0: document.write(“Sleepy Sunday“) ; break ; default: document.write(“Im looking forward to this weekend!“) 示例： Switch结构 21 循环 lfor循环 ldo-while lwhile 22 循环语句 l 循环表示重复执行的动作。JavaScript中可以使用 while循环、do-while循环、for循环。 l For循环： for(=; ; ) ; l 执行过程： 首先给赋，然后*判断（应该是 一个关于的条件表达式）是否成立，如果成立就执行 ，然后按对作累加，回到“*”处 重复，如果不成立就退出循环。 23 While循环 lWhile循环格式： while（循环条件） ； l执行过程 while 循环的作用是当满足时执行。 在部分可以累加最终不满足 24 Do-while循环 lDo-while循环格式： do ； while（循环条件）； l执行过程 while 循环的作用是当满足时执行。 在部分可以累加最终不满足 注意：和while循环的区别在于先执行循环体一次， 再判断循环条件 25 Break和continue lbreak结束整个循环 作用是立即跳出循环。 lcontinue结束当前循环,继续下一次循环 作用是中止本次循环，并执行下一次循环。如果循 环的条件已经不符合，就跳出循环。 26 String String字符串： 可用于处理或格式化文本字符串以及确定和定位字 符串中的子字符串。 l属性： Length：表示字符串长度，即字符串中字符的个数 。 27 String 字符串方法： lcharAt(n)：返回指定位置的字符 lindexOf(“”)：返回指定字符的下标位置 llastIndexOf(“”)：返回指定的字符的最后一 次出现的位置。 lsubstring(s，e)：返回从指定起始位置到指 定结束位置的字符串。 lsubstr(s，l)：返回从指定起始位置的指定长 度的字符串。 28 自定义函数 l定义函数： function 函数名( 参数1,参数2， ) 语句; l调用函数： 函数调用一般和表单元素的事件一起使用，调用格式为： 事件名“函数名” ; function sum ( one, two) var result = one + two; return result; 29 Javascript提示框 名称 说明 alert (“m提示信息“)显示包含消息的对话框。 confirm（“提示信息”）显示一个确认对话 框，包含一个 确定取消按钮 prompt（”提示信息“）弹出提示信息框 加法计算器 31 function sum() var txt1 = document.myfrm.txt1; var txt2 = document.myfrm.txt2; var txt3 = document