《MJavaScript基础.ppt》由会员分享,可在线阅读,更多相关《MJavaScript基础.ppt(32页珍藏版)》请在金锄头文库上搜索。
1、1JavaScript基础基础2本章目标本章目标l理解什么是 JavaScriptl如何将 JavaScript 嵌入到 HTML 中l理解变量、数据类型和运算符l掌握判断与循环语句l了解对象的常用方法l掌握自定义函数的书写3什么是什么是JavaScript lJavaScript 是一种脚本语言l提供用户交互 l动态更改内容 l数据验证 4JavaScript简介简介lJavaScript主要增加页面的互动性。 JavaScript和Java是两种完全不同的东西,只是名称有些相似。 B/S结构中Java运行在服务端,JavaScript运行在客户端。 JavaScript本质是一个文档,所以
2、可以使用文本编辑器来编写JavaScript代码。最简单使用记事本编辑。5将将JavaScript嵌入网页嵌入网页 l可以将 JavaScript 语句插入 HTML 文档,方式 如下:l使用 标签将语句嵌入文档l将 JavaScript 源文件链接到 HTML 文档中6使用使用 Script 标签标签JavaScript 代码 document.write(欢迎来到 JavaScript 世界); 尽情享受学习的快乐! 脚本代码设置语言7使用外部使用外部 JS 文件文件 l外部 JavaScript 文件可以链接到 HTML 文档中lscript 标签的 src(源文件)属性可用于包括此外部
3、文件 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” 变量名变量名varvar x, y,
4、 z = 10; x, y, z = 10;varvar a= 10; a= 10;同时声明和初始化变量同时声明和初始化变量a = 10;声明变量声明变量声明多个变量声明多个变量赋值赋值11数据类型数据类型数据数据类型型说 明明示示 例例数字型整数或实数487, 25.95布尔型执行逻辑运算true或 false 字符串型一组字符“Hello”空特殊关键字,表示不存在的值。 null12运算符运算符 l运算符对一个或多个变量或值(操作数)进行运算,并返 回一个新值l根据所执行的运算,运算符可分为以下类别:l算术运算符l比较运算符l逻辑运算符13运算符运算符运算符说 明示 例+加a = 5 +
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 !=
6、 5大于。如果左边的操作数大于右边的操作数,则返回真。var1 var2小于。如果左边的操作数小于右边的操作数,则返回真。var2 var1=小于等于。如果左边的操作数小于或等于右边的操作数,则返回真。var2 = 4var2 =大于等于。如果左边的操作数大于或等于右边的操作数,则返回真。var1 = 5var1 = var215逻辑运算符逻辑运算符运算符运算符值说 明明与 ( &)expr1& expr2 只有当 expr1 和 expr2 同为真时,才返回真。否则,返回假。或 ( | )expr1 | expr2如果其中一个表达式为真,或两个表达式同为真,则返回真。否则,返回假。非 (!)
7、!expr如果表达式为真,则返回假。如果为假,则返回真。16条件语句用于测试条件。if(条件) JavaScript代码; 语法:语法:if 语句语句如果要执行多个语句,必须将这些语句放在一对大括号 ( ) 内。但如果只要执行一个语句,则可以省略大括号17if else 语句语句if(条件) /JavaScript代码;else /JavaScript代码;Ifelse.语句的语法:语句的语法:18if (条件1) if (条件2) /JavaScript代码; 嵌套嵌套if语句语法:语句语法:嵌套嵌套 if 语句语句19switch (表达式)case 表达式: . case 表达式: .
8、case 表达式: . case 表达式: . default:. 语法:语法:Switch结构结构20/Youwillreceiveadifferentgreetingbased/onwhatdayitis.NotethatSunday=0,/Monday=1,Tuesday=2,etc.vard=newDate()theDay=d.getDay()switch(theDay)case5:document.write(“FinallyFriday”);break;case6:document.write(SuperSaturday);break;case0:document.write(Sl
9、eepySunday);break;default:document.write(Imlookingforwardtothisweekend!)示例:示例:Switch结构结构21循环循环 lfor循环ldo-whilelwhile 22循环语句循环语句l循环表示重复执行的动作。JavaScript中可以使用while循环、do-while循环、for循环。lFor循环: for(=; ; ) ;l执行过程:首先给赋,然后*判断(应该是一个关于的条件表达式)是否成立,如果成立就执行,然后按对作累加,回到“*”处重复,如果不成立就退出循环。23While循环循环lWhile循环格式: while
10、(循环条件) ;l执行过程while 循环的作用是当满足时执行。在部分可以累加最终不满足24Do-while循环循环lDo-while循环格式: do ; while(循环条件);l执行过程while 循环的作用是当满足时执行。在部分可以累加最终不满足注意:和while循环的区别在于先执行循环体一次,再判断循环条件25Break和和continuelbreak结束整个循环作用是立即跳出循环。lcontinue结束当前循环,继续下一次循环作用是中止本次循环,并执行下一次循环。如果循环的条件已经不符合,就跳出循环。26StringString字符串:可用于处理或格式化文本字符串以及确定和定位字符串
11、中的子字符串。 l属性:Length:表示字符串长度,即字符串中字符的个数。27String字符串方法:lcharAt(n):返回指定位置的字符lindexOf(“”):返回指定字符的下标位置llastIndexOf(“”):返回指定的字符的最后一次出现的位置。lsubstring(s,e):返回从指定起始位置到指定结束位置的字符串。lsubstr(s,l):返回从指定起始位置的指定长度的字符串。28自定义函数自定义函数l定义函数:function 函数名( 参数1,参数2, ) 语句; l调用函数:函数调用一般和表单元素的事件一起使用,调用格式为:事件名“函数名” ;function sum
12、 ( one, two) var result = one + two; return result;29Javascript提示框提示框名称 说明 alert (“m提示信息)显示包含消息的对话框。 confirm(“提示信息”)显示一个确认对话框,包含一个确定取消按钮prompt(”提示信息“)弹出提示信息框加法计算器加法计算器31function sum()var txt1 = document.myfrm.txt1;var txt2 = document.myfrm.txt2;var txt3 = document.myfrm.txt3;txt3.value = parseInt(txt1.value)+parseInt(txt2.value); + = 加法计算器加法计算器32总结总结l理解什么是 JavaScriptl如何将 JavaScript 嵌入到 HTML 中l理解变量、数据类型和运算符l掌握判断与循环语句l了解对象的常用方法l掌握自定义函数的书写