《javascript介绍.ppt》由会员分享，可在线阅读，更多相关《javascript介绍.ppt（59页珍藏版）》请在三一办公上搜索。
1、第2章,JavaScript基础,叶晓鸣,主要内容,JavaScript简介*.js文件变量与作用域数据类型运算符数组与函数控制语句,什么是JavaScript-1,一万元整,Jeny Smiss,10,000,Jeny Smiss,A/c No.010077,瑞士银行,Jeny 想在银行存钱,验证 Jeny 帐户详细信息,余额,帐号,签名,帐户验证完毕,什么是JavaScript-2,同样，,Jeny,Jeny 想创建一个电子邮件帐户,*24US,帐户 Id：密码：年龄：国家：,*,这样，JavaScript 将验证数据并给出错误信息,什么是JavaScript,JavaScript 是一种
2、脚本语言提供用户交互 动态更改内容 数据验证,JavaScript的概念以及特点,JavaScript是一种基于对象(Object)和事件驱动(Event Driven)并具有安全性能的脚本语言。它是通过嵌入或调入在标准的HTML语言中实现的。它的出现弥补了HTML语言的缺陷，可以开发客户端的应用程序。,JavaScript的概念以及特点,JavaScript具有以下几个基本特点：是一种脚本编写语言基于对象的语言，提供面向对象支持简单性动态性跨平台性典型应用：客户端交互数据验证广告显示网页特效,将JavaScript嵌入网页,可以将 JavaScript 语句插入 HTML 文档，方式 如下：
3、使用 标签将语句嵌入文档将 JavaScript 源文件链接到 HTML 文档中,使用 Script 标签,JavaScript 代码,document.write(欢迎来到 JavaScript 世界);尽情享受学习的快乐!,脚本代码,设置语言,语句-简单语句,JavaScript的代码语句由一行中的一个或多个项和符号组成。每行开始一条新的语句，不过显式地终止语句是一个好方法。可以用分号（;）来实现，分号是 JavaScript的终止字符。,var name=Robin;var today=new Date();,语句-复合语句,用大括号括起来的一组 语句称为复合语句。if(xy)t=x;x
4、=y;由三个简单语句构成一个复合语句 y=t;,JavaScript的标识和说明语句,使用外部 JS 文件,外部 JavaScript 文件可以链接到 HTML 文档中SCRIPT 标签的 SRC（源文件）属性可用于包括此外部文件,使用外部 JS 文件,JavaScript 代码(test.htm),使用外部文件以上文本是通过访问外部 JavaScript 文件显示的,JavaScript有许多保留关键字。这些关键字可分为三种类型：JavaScript保留关键字将来的保留字应避免的单词.,JavaScript的保留关键字,JavaScript的保留关键字,JavaScript的数据类型,变量,
5、JavaScript中采用弱类型变量，变量可以不做声明和不做类型说明，而在使用或赋值时确定类型。但为了形成良好的编程风格，变量应该采取先定义再使用的方法。JavaScript中变量的定义用关键字var来实现。,变量,变量,变量名不能与保留字冲突。变量名必须以字母或者下划线（_）开头，不能用数字或者其他非字母字符作为变量名开头。变量名中不能包含空格。JavaScript是区分大小写的，所以给变量命名时要考虑大小写的问题。myVar、myVAR、myvar,声明变量,var a;“var”用于声明变量的关键字“a”变量名,同时声明和初始化变量var a=10;,a=10;,声明变量,声明多个变量v
6、ar x,y,z=10;,赋值,声明变量,使用变量var x;x=prompt(淘宝网竟拍，请出一口价,1);document.write(拍卖价格+x+)/+用来连接多个字符串document.write(恭喜您，您以最高价拍卖成功！);alert(欢迎下次光临！);,定义变量,赋 值,输 出,prompt(“提示信息”,”默认值”)将弹出提示对话框，接受用户的输入。点击确定返回输入的字符串，点击取消返回空字符串。,变量 a、b 和 c 只能在其各自的函数中被访问,变量的作用域,脚本,函数function1局部变量a,函数function2局部变量b,函数function3局部变量c,可由函
7、数 1、函数 2 和函数 3 访问,全局变量 gg,常量,整型浮点型字符串型,数据类型,JavaScript有6种数据类型。主要的类型有Number、String、Object以及Boolean，其他两种类型为Null和Undefined。,数据类型,字符串是用单引号或双引号来说明的（使用单引号来输入包含引号的字符串）。一个字符串也是JavaScript中的一个对象，不过是个特殊情形，有专门的属性。下面是字符串的示例：The cow jumped over the moon.Avast,ye lubbers!roared the technician.42,String数据类型,Boolean
8、类型可能的Boolean值有true和false。这是两个特殊值，不能用作1和0。Undefined数据类型一个为undefined的值就是指在变量被创建后，未给该变量赋以前所具有的值。Null数据类型null值就是没有任何值，什么也不表示。,其他类型,var x=100;var y;var z;document.write(竞拍SONY数码相机 600万像素+x+$起价);y=prompt(加多少银子？,1);z=x+y;alert(您最终的出价n+z+$);/”n”用于换行显示,Prompt函数返回输入的字符串,“+”号的用法,100200?bug,+字符串相连：100+”200”,200
9、,var x=100;var y;var z;document.write(竞拍SONY数码相机 600万像素+x+$起价);y=prompt(加多少银子？,1);z=x+parseFloat(y);alert(您最终的出价n+z+$);/”n”用于换行显示,parseFloat()函数将字符串转换为float数据 parseInt()函数将字符串转换为int数据如果转换失败，返回NaN值(not a number),“+”号的用法,运算符,运算符对一个或多个变量或值（操作数）进行运算，并返回一个新值根据所执行的运算，运算符可分为以下类别：算术运算符比较运算符逻辑运算符,算术运算符,算术运算符
10、,实现步骤：1.设计页面2.指定各个文本框的名称3.编写脚本代码4.浏览并调试,function calcu()var numb1=document.calc.num1.value;var numb2=document.getElementById(num2).value;var total=parseFloat(numb1)*parseFloat(numb2);document.calc.result.value=total;,计算总价并显示,添加单击事件，单击按钮时调用“calcu()”函数,算术运算符,获取表单中输入的数据：document.表单名.表单元素名.value,定义calcu
11、()计算函数,实现两个数相乘的功能.定义函数的语法：function 函数名(参数列表)/JavaScript语句；,比较运算符,function calcu()var numb1=document.calc.num1.value;var numb2=document.calc.num2.value;var total=parseFloat(numb1)*parseFloat(numb2);document.calc.result.value=total;if(total500)alert(购买总价超过500n支付时将赠送超级Q币2枚！);.其他代码略，同上例,比较运算符,购买总价超过500，
12、赠送超级Q币2枚！,逻辑运算符,逻辑运算符,function calcu()var numb1=document.calc.num1.value;var numb2=document.calc.num2.value;var total=parseFloat(numb1)*parseFloat(numb2);document.calc.result.value=total;if(total500).其他代码略，同上例,逻辑运算符,5001000 之间，赠送超级Q币两枚；10002000之间，赠送IBM智能鼠标一只；2000以上，直接与贵宾台联系。,JavaScript 的 事 件,JavaScr
13、ipt事件主要包括超级连接事件、浏览器事件和界面事件三大类。界面事件包括Click（单击）、Mouse（鼠标移出）、MouseOver（鼠标移过）和MouseDown（鼠标按下）等。,数组,常用属性 length：返回数组中元素的个数常用方法,var emp=new Array(3);emp0=Ryan Dias;emp1=Graham Browne;emp2=David Greene;emp.sort();document.write(“排序结果是：);document.write(emp0+);document.write(emp1+);document.write(emp2+);,数组排
14、序,JavaScript 函数,内置函数 eval 函数：用于计算字符串表达式的值 isNaN 函数：用于验证参数是否为 NaN（非数字）,JavaScript内置对象-时间,时间对象是JavaScript的内置对象，使用前必须先申明。语法：var curr=new Date();注意Date()的首字母必须大写。,var curr=new Date();document.write(今天是);switch(curr.getDay()case 0:document.write(周日,休息了！);break;case 1:document.write(周一,需要工作！);break;case 2
15、:document.write(周二,需要工作！);break;case 3:document.write(周三,需要工作！);break;case 4:document.write(周四,需要工作！);break;case 5:document.write(周五,需要工作！);break;case 6:document.write(周六,休息了！);break;,JavaScript内置对象-时间,JavaScript内置对象-时间,Math对象可以用来处理种种数学运算。Math对象的内置方法定义了各种数学运算和可以直接调用的Math对象的方法语法：Math.数学函数（参数）,JavaScr
16、ipt内置对象-Math,Math.abs(number)Math.sin(number)Math.cos(number),function rnd()var a=Math.random(1);alert(0-1的随机数为：+a);,一般利用String对象提供的函数来处理字符串。String对字符串的处理主要提供了下列方法。charAt(idx)indexOf(chr)lastIndexOf(chr)toLowerCase()toUpperCase(),JavaScript内置对象-String,var str=I AM A CHINESE,I LIKE CHINA!;a=str.charA
17、t(7);b=str.indexOf(a);c=str.lastIndexOf(“A);d=str.toUpperCase();document.write(a+);document.write(b+)document.write(c+)document.write(d+),JavaScript内置对象-String,自定义函数,定义函数：function 函数名(参数1,参数2，)语句;调用函数：函数调用一般和表单元素的事件一起使用，调用格式为：事件名“函数名”;,function sum(one,two)var result=one+two;return result;,表示单击此按钮时，
18、调用函数sum()执行,函数的应用,num1,num2,result,定义函数,定义函数compute()，完成计算的功能。op参数代表运算符号,调用函数,第一个数 第二个数 计算结果,If语句,分支结构：,switch语句,分支结构：,For 循环演示document.write(打印金字塔直线);for(var i=0;i);,for循环例：var i;for(i=0;i10;i+)/语句;,for 循环,如何实现,当i=5 时，,document.write(每个字符都对应一个漂亮的埃及图像);do var c=prompt(输入一个字符，输入N 或n停止,A);document.wri
19、te(+c+);while(c!=N,while循环 while(循环条件)/语句；dowhile循环 do/语句；while(循环条件);,while和dowhile循环,先执行，后判断循环条件,输入一个字符，直到N停止，用哪个循环,总结,变量与作用域数据类型弱类型JavaScript包含几种数据类型运算符算术运算符、比较运算符、逻辑运算符、数组与函数控制语句条件循环,.下面哪一种不是脚本语言()。AJavaScript B.Java C.VBScript D.Jscript.()元素用来在HTML中嵌入JavaScript。A.SCRIPT B.STYLE C.OBJECT D.LINK.JavaScript提供了很多内置的对象，其中用来实现日期和时间操作的对象是()。A.Date B.Math C.String D.Array.JavaScript中具有打开或关闭浏览器窗口功能的对象是()。A.document B.window C.navigator D.history.JavaScript支持很多类型的事件，如onCfick、onLoad、onFocus等，其中常用在按钮上的事件是()。A.onLoad B.onFocus C.onClick D.onMouseOver,习题,作业,制作简单计算器,
