Java Web 开发课件第一章:Javascript概述与入门_第1页
Java Web 开发课件第一章:Javascript概述与入门_第2页
Java Web 开发课件第一章:Javascript概述与入门_第3页
Java Web 开发课件第一章:Javascript概述与入门_第4页
Java Web 开发课件第一章:Javascript概述与入门_第5页
已阅读5页,还剩33页未读 继续免费阅读

下载本文档

版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领

文档简介

Javascript第一章Javascript概述与入门课程目标掌握JavaScript基本语法掌握事件与事件驱动程序的调用,完成界面上的动态效果掌握DOM编程,能够对页面上各种元素进行灵活控制掌握浏览器对象模型,能够控制窗体界面运用正则表达式对表单输入项进行校验课程内容与课时安排第一章JavaScript概述与简介(1课时)第二章对象基础(1课时)第三章自定义对象(1课时)第四章JavaScript继承机制(0.5课时)第五章浏览器对象(1课时)第六章DOM基础(2课时)第七章表单、表单元素(1课时)第八章正则表达式(1课时)第九章JavaScript中的Xml与xml解析(1课时)第十章JavaScript中的错误处理(1课时)目标理解什么是

JavaScript如何将JavaScript嵌入到HTML中变量与数据类型和运算符流程控制语句窗口输入输出JavaScript发展历史JavaScript历史Nombas公司、Cmm语言(ScriptEase)、

宏操作脚本网景公司(Netscape)NavigateSun公司LiveWire(LiveScript)和Javascript其它脚本语言:JScriptVbScript(微软vb)ActionScript(Flash)三足鼎立->标准化ECMAScript1997年,欧洲计算机制造商协会(ECMA)推出ECMA-262标准JavaScript语言特点JavaScript是脚本语言嵌入网页中,

无需编译,由web浏览器解释执行JavaScript是基于对象的语言JavaScript是事件驱动的语言JavaScript是平台无关的语言运行在浏览器中,用于开发基于客户端的动态web页,由浏览器提供客户端脚本的运行环境,与操作环境无关JavaScript与Java主要区别开发公司不同语言类型不同(基于对象与面向对象)

JavaScript是基于对象的,它自身具有已创建完毕的对象;而Java则是面向对象的,对象必须从类中创建执行方式不同(解释和编译)

Java被编译成字节代码文件;JavaScript解释型语言,由浏览器边编译边执行代码格式不同JavaScript的代码以字符的形式嵌入在HTML文档中;JavaApplets则是由文档引用,其代码以字节代码的形式保存在另一个独立的文件中变量类型不同(弱类型与强类型)JavaScript为弱类型,Java为强类型联编方式不同(动态联编与静态联编)

Java静态联编,对象引用在编译时检查,JavaScript动态联编JavaScript能做什么提供用户交互动态生成页面内容动态更改内容动态改变页面效果数据验证

综述JavaScript是属于网络的脚本语言!JavaScript被数百万计的网页用来改进设计、验证表单、检测浏览器、创建cookies,以及更多的应用。JavaScript是因特网上最流行的脚本语言。JavaScript很容易使用!你一定会喜欢它的!JavaScript组成核心(ECMAScript)文档对象模型(DOM)浏览器对象模型(BOM)JavaScript知识结构语法基础数据类型,强制数据类型转换变量,函数运算符条件,循环语句核心对象数组对象,字符串对象,数学对象,日期对象,自定义对象浏览器对象Window、document、location、historyform对象、表单元素对象将JavaScript嵌入网页三种方法1.使用<script>…</script>

标签将语句嵌入文档2.将外部JavaScript源文件链接到html文档中

<scriptsrc="test.js"></script>可使多个网页共享一个脚本文件内的代码一般在其中定义一系列在多个网页中都可能要用到的函数3.作为网页元素的事件处理程序,当事件触发时自动运行<marqueeonmouseover=“this.stop()”>使用script标签JavaScript代码<html> <head> <script

type="text/javascript"> document.write("欢迎来到JavaScript世界"); </script> </head> <body> <p>这里是网页主体内容!!! </body></html>脚本代码设置语言使用外部JS文件JavaScript代码(test.htm)<html><head><title>使用外部文件</title><scriptsrc="test.js"></script></head><body> <p>以上文本是通过访问外部JavaScript文件显示的</p></body></html>document.write("喂!你好吗?")JavaScript代码(test.js)JavaScript基本语法JavaScript语法结构既宽松又简单JavaScript基本语法部分:语句:一条由计算机完成的、帮助你达到某种目的的指令,JavaScript中的每一行都可认为是一条语句变量:一个代表某个值的名字就是变量表达式:A-1+B就是表达式函数:具有一定功能的程序段数据类型数据类型说明示例基本数据类型数字型(number)整数或实数487,25.95字符串型(string)一组字符“Hello”布尔型(boolean)执行逻辑运算true或false引用数据类型对象(Object)无序的值的集合function函数类型特殊数据类型null代表”无对象”的值undefined未声明或没有赋值的变量变量变量是一种引用内存位置的容器,用于保存在执行脚本时可以更改的值JS是弱类型的语言,即声明变量时不需指定数据类型,为它赋值时其类型才确定,而且再次为其赋值可改变它的数据类型.变量的命名:只能包含数字,字母,下划线("_"),但不能以数字开头,不能是保留字(关键字)JavaScript区分大小写,即变量myVar、myVAR和myvar是不同的变量.命名规则推荐:Camel、Pascal、匈牙利类型标记法(例如:productName、ProductName、strProductName)关键(保留)字变量的声明var

关键词声明变量函数内声明变量则为局部变量,函数外声明则为全局变量.(必须要以var

声明)<script

type="text/javascript"> //语句以分号结束

variNumA; //声明变量

iNumA=10; //给变量赋值

iNumB=20; //未声明变量直接赋值

variNumC=10; //声明的同时初始化

varx,y,z=10; //声明多个变量</script>表达式-算术运算符运算符说明示例+如果操作数都是数字时执行加法运算,如果其中的操作数有字符串时,会执行连接字符串的作用A=5+8//结果是13A="5"+8//结果是"58“38+“abc”+12;38+12+“abc”;-减法A=8–5*乘法A=8*5/除法A=20/5%取余-相除之后的余数10%3=1++一元递增。此运算符只计算一个操作数,将操作数的值加1。返回的值取决于++运算符是位于操作数之前还是位于操作数之后。++x返回递增后的x值x++返回递增前的x值--一元递减。此运算符只计算一个操作数。返回的值取决于--运算符是位于操作数之前还是位于操作数之后--x返回递减后的x值x--返回递减前的x值-一元求反。此运算符返回操作数的相反数如果a等于5,则-a=-5表达式-比较运算符运算符说明示例==等于。如果两个操作数相等,则返回truea==b===全等于。值相等,数据类型也相等a===b!=不等于。如果两个操作数不等,则返回truea!=b>大于。如果左操作数大于右操作数,则返回truea>b>=大于或等于。如果左操作数大于或等于右操作数,则返回truea>=b<小于。如果左操作数小于右操作数,则返回truea<b<=小于或等于。如果左操作数小于或等于右操作数,则返truea<=b表达式-逻辑运算符运算符例子说明&&expr1&&expr2逻辑与||expr1||expr2逻辑或!!expr逻辑非方式一、function

函数名([参数[,参数...]]){

<语句组>

[return<表达式>;]

}方式二、函数名=function([参数[,参数...]]){…}方式三、(较不常用)Function类函数名=newFunction([“参数名”[,“参数名”...]],“函数体”)函数的声明与调用函数的声明与调用(续)

函数示例:

functiondistance(a

,

b){

var

c=a-b; //变量声明

return

c; //函数返回值

}

distance(4,3); //带参函数的调用函数的声明与调用(续)arguments对象functiondoSum(){if(arguments.length==2){returnarguments[0]+arguments[1];}elseif(arguments.length==3){returnarguments[0]+arguments[1]+arguments[2];}}alert(doSum(4,5));alert(doSum(4,5,6));函数的声明与调用(续)内部函数示例:functionfunc(x,y){returninner();functioninner(){returnx+y;}}变量的作用域变量a、b和c只能在其各自的函数中被访问script函数function1局部变量a函数function2局部变量b函数function3局部变量c可由函数1、函数2和函数3访问全局变量gg全局变量不需要以var

关键字进行声明,但局部变量则必须以此关键字来声明。(建议所有变量都采用var声明)

Javascript没有块级作用域类型转换强制类型转换,ECMAScript中可用的3种强制类型转换:

Boolean(value);

Number(value);

String(value);NaN---不是一个数字类型

函数函数名作用isNaN()检测一个值是否是非数字的值parseInt()将字符串转换为整数,转换第一个无效字符之前的字符串parseFloat()将字符串转换为数字,转换第一个无效字符之前的字符串alert()弹出对话框显示消息confirm()用对话框询问一个回答为是或否的问题prompt()弹出对话框,请求用户输入一个字符串document.write()向文档窗口输出字符串思考:variNum=10;varsNum=iNum.toString(8);variNum1=parseInt("12.6");variNum2=parseInt("hello");variNum3=parseInt("123world");varfNum4=parseFloat("25.12.6");varb1=Boolean("");varb1=Boolean(undefined);varb1=Boolean(0);variNum=Number("25.12.6");varbl=isNaN(Number("13f"))求值运算符通常这些运算符包括:条件运算符:(condition)?trueVal:falseValtypeof运算符

typeof运算符返回字符串,该字符串代表操作数的类型status=(age>=18)?"adult":"minor"varx=5;document.write(typeof(x));条件语句if…else语句switch语句if(condition){statements;}else{statements2;}switch(expression){casevalue1:statements;

break;casevalue2:statements;

break;...default:statements;}循环语句for循环for-indo…whilewhilebreak(结束循环,跳出循环体)continue(结束本次循环,进入下一次循环)语法和C语言一致课堂实例思考:variNum=0;for(varm=0;m<3;m++){

mypoint:for(varn=0;n<5;n++){for(vark=0;k<5;k++){ if(k==1)break

mypoint;

iNum++;}}

alert(“hi”);//这里会弹出提示几次?}alert(iNum);

温馨提示

  • 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
  • 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
  • 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
  • 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
  • 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
  • 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
  • 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。

评论

0/150

提交评论