《JAVA初中级备课完美版——JavaScript的基本语法课件.ppt》由会员分享，可在线阅读，更多相关《JAVA初中级备课完美版——JavaScript的基本语法课件.ppt（28页珍藏版）》请在三一办公上搜索。
1、第一章,JavaScript的基本语法,本章任务,制作淘宝网购物简易计算器页面,掌握脚本的基本结构(Script标签)简单记忆基本语法变量的定义与赋值数据类型与转换parseFloat等运算符和控制语句同Java灵活运用高级语法自定义函数function,本章目标,回顾HTML-1,常用的HTML标签有哪些？,请说说表格的基本结构以及跨行、跨列的用法？,单元格内容 单元格内容,回顾HTML-2,请简述表单的基本结构？常用表单元素有哪些？,如何使用样式表定义统一的字体外观和文本框的细边框样式？,表单的基本结构：常用的表单元素有：文本框（text）、密码框（password）、单选按钮（radio
2、）、复选框（checkbox）、列表框（和）、按钮（button、submit和reset）、多行文本框（）。,统一的字体外观：font-family:“黑体;font-size:18px;color:#FF0000;细边框样式：border-width:1px;border-style:solid;,为什么要学JavaScript,表单验证,页面动态效果,演示示例2：层的切换 和 树形菜单等,演示示例1：注册表单验证,什么是JavaScript,脚本的基本结构 var count=0;document.write(淘宝网欢迎您！);for(i=0;i淘宝网欢迎您！);BODY部分的内容,如何
3、使用JavaScript实现此部分内容？,什么是JavaScript,脚本的执行原理,应用服务器,IE,IE,解析HTML标签和JavaScript脚本,从服务器端下载含JavaScript的页面,返回响应,客户端请求含JS的页面,发送请求,1,用户输入,2,3,JavaScript的基本语法,脚本的基本结构var count=0;document.write(淘宝网欢迎您！);for(i=0;i淘宝网欢迎您！);BODY部分的内容,大家想想上面JavaScript代码与我们学过的Java、C#语言有相似的地方吗？,JavaScript的基本语法,变量的声明和赋值,var count;,cou
4、nt=5;,定义变量,赋值,“var”用于声明变量的关键字“count”变量名,var x,y,z=10;,var count=10;,同时声明和赋值变量,声明多个变量,数据类型,JS中有五种原始数据类型：Undefined、Null、Boolean、Number以及String。Undefined数据类型的值只有一个:Undefined。Null数据类型的值只有一个：Null。Boolean数据类型的值有两个：true和false。Js中没有char 数据类型。typeof是一元运算符。返回值有五个：undefined、null、boolean、number以及string以及object。
5、强制类型转换：Boolean(value),Number(value),String(value).,运算符号,运算符对一个或多个变量或值（操作数）进行运算，并返回一个新值根据所执行的运算，运算符可分为以下类别：算术运算符+、-、*、/、%、+、-、-(求反)比较运算符=、!=、=、=逻辑运算符&、|、！,逻辑控制语句,if条件语句switch多分支语句for、while循环语句,if(条件)/JavaScript代码;else/JavaScript代码;,switch(表达式)case 常量1:JavaScript语句1;break;case 常量2:JavaScript语句2;break;
6、.default:JavaScript语句3;,for(初始化;条件;增量)语句集;while(条件)语句集;,注释,单行注释以/开始，以行末结束例如：/表示JavaScript代码的开始,多行注释以/*开始，以*/结束，符号/*/指示中间的语句是该程序中的注释。例如：/*helloWorld.html 2007-9-29 第一个JavaScript程序*/,类型转换,parseInt(String)将字符串转换为整型数字 如:parseInt(“86”)将字符串“86”转换为整型值86parseFloat(String)将字符串转换为浮点型数字 如:parseInt(“34.45”)将字符串
7、“34.45”转换为浮点值34.45,什么是函数,函数的含义：类似于Java中的方法，是执行特定任务的语句块。,如何希望点击某个按钮后才显示“HelloWorld”，并能输入显示的次数，怎么办？,什么是函数,1、在页面中放置一个文本框和一个按钮，让用户输入次数后点击按钮才显示2、把循环显示的代码放置到函数中，当点击按钮时，才调用函数显示HelloWorld经过分析，该如何解决上面问题？,如何使用函数,创建函数 function 函数名(参数1,参数2，)语句;调用函数 函数调用一般和表单元素的事件一起使用，调用格式为：事件名“函数名”;,function showHello()var coun
8、t=document.myForm.txtCount.value;for(i=0;iHelloWorld);,表示单击此按钮时，调用函数showHello()执行,深入了解函数,JS中函数就是对象。没有方法（函数）重载的概念。在JS中有一个Function对象，所有自定义的函数都是Function对象类型的。Function对象接收的所有参数都是字符串类型的，其中最后一个参数就是要执行的函数，而前面参数是函数要接收的参数。每个函数都有一个隐含的对象arguments，表示给函数实际传递的参数。,var add=new Function(“number”,”alter(number+10);”)
9、;Add(20);var add1=new Function(“number1”,”number2”,”alter(number1+number2)”);Add1(10+20);,深入了解函数,每一个函数对象都有一个length属性，表示该函数期望接收的参数格式。它与函数的arguments不同。Arguments.length表示函数实际接收的参数格式。,Function add2()if(1=arguments.length)Alert(arguments0);else if(2=arguments.legth)Alert(arguments0+arguments1);,创建对象,构造函数
10、定义对象方法名；建立方法的描述函数。,function member(name,gender)this.name=name;this.gender=gender;this.display=display;function display()var str=this.name+”:”+this.gender;Document.writer(str+”);var m1=new member(“zhangsan”,”f”);var m2=new member(“list”,”f”);var m3=new member(“wangwu”,m);m1.dispaly();m2.dispaly();m3.
11、dispaly();,课堂练习,自定一个圆的对象。属性：半径。方法：计算圆的面积，和圆的周长的方法,课堂练习,编写如左图所示，具有能对两个操作数进行加、减、乘、除运算的简易计算器。,名为myform的表单,名为divButton2的普通按钮,名为txtNum1的文本框,提示：加、减、乘、除四个按钮分别调用四个函数实现两个数相加、相减、相乘和相除,常见错误1,function compute(op)x=5;var num1,num2;num1=parseFloat(document.myform.txtNum1.value);num2=parseFloat(document.myform.txt
12、Num2.value);if(op=+)document.myform.txtResult.value=num1+num2;if(op=-)document.myform.txtResult.value=num1-num2;,变量可以不声明而直接赋值。如x=5;不推荐使用，容易出错。,常见错误2,function compute(op)var Num1,num2;num1=parseFloat(document.myform.txtNum1.value);num2=parseFloat(document.myform.txtNum2.value);if(op=+)document.myform
13、.txtResult.value=num1+num2;if(op=-)document.myform.txtResult.value=num1-num2;,JavaScript大小写非常敏感,常见错误3,function compute(op)var num1,num2;num1=document.myform.txtNum1.value;num2=document.myform.txtNum2.value;if(op=+)document.myform.txtResult.value=num1+num2;if(op=-)document.myform.txtResult.value=num1-num2;,需要使用parseFloat方法进行转换，否则认为是字符串,总结,大家简述一下JavaScript脚本的基本结构？JavaScript与Java基本语法有哪些相同之处？在JavaScript中，如何定义一个函数？在JavaScript中，如何调用一个函数？在JavaScript中，常见错误有哪些？,
