《JavaScript介绍》PPT课件.ppt

JavaScript介绍,-网页脚本语言介绍,JavaScript介绍,JavaScript概述 JavaScript基本语法 JavaScript基本语句 JavaScript常见对象 JavaScript事件,使用HTML只能制作出静态的网页，无法独立地完成与客户端动态交互的网页任务。 JavaScript语言是内嵌于HTML中的脚本语言。 JavaScript仅仅是一种嵌入到HTML文件中的描述性语言，它并不编译产生机器代码，只是由浏览器的解释器将其动态地处理成可执行的代码。而Java语言是一种比较复杂的编译性语言。 JavaScript是一种基于对象的程序设计语言。它所包含的对象有两个组成部分，即变量和函数，也称为属性和方法。,11.1 JavaScript概述,JavaScript的使用方法, my first page Document.write(“简单的JavaScript”); ,标识脚本的开始，在 此处指定使用哪种脚 本语言。,标识脚本的结束。,这部分就是JavaScript 脚本。,11.2 JavaScript基本语法,JavaScript语言有着自己的常量、变量、表达式、运 算符等等。 11.2.1 常量 JavaScript常量的值是不能改变的。,11.2.2 变量,变量值在程序运行期间是可以改变的。在使用变量时，最好先对其进行声明。 变量的声明主要就是明确变量的名字、变量的类型，以及变量的作用域。 变量的命名可以随意取，注意以下几点： 变量名只能由字母、数字和下划线“_”组成，以字母开头 变量名不能使用JavaScript中的关键字，如var,int,true,false等等,变量的类型，在JavaScript中声明变量使用的是var关键字，如 Var example 定义了变量就要向其赋值，利用赋值符“=”来完成。 如：Var example1=50； Var example2=你好； Var example3=true； 变量的类型是由数据的类型来确定的。,11.2.3 运算符,定义完变量之后，对其进行赋值、改变、计算等一系列操所，这一过程通常又是表达式来完成的，而表达式中的一大部分是在做运算符处理。,连接符,+和&连接符的区别： +连接符只能用于两个字符串的连接； &连接符可以用于两个任意类型的数据连接。,函数是JavaScript语句的组合，它包含函数名，调用时JavaScript语句被顺序执行。 JavaScript函数定义如下： Function 函数名（参数表） 函数执行部分,11.2.4 表达式,表达式其实就是常量、变量、运算符的集合。,11.2.5 函数,return 表达式,return语句返回值,11.3 JavaScript基本语句,JavaScript的基本语句主要有两种结构，一种是循环语句；一种是条件语句。 11.3.1 if else语句 If(条件) 执行语句1 else 执行语句2,条件为true,执行语句1；否则执行语句2。,11.3.2 switch语句 当条件比较多时，为了使程序更加清晰，可以使用switch语句。 分支语句switch可以根据一个变量的不同取值而采取不同的处理方法。,表达式值与case语句中的常量比较，如果相匹配，则执行case语句后的代码；都不匹配，则执行default语句后的代码。,11.3.3 for循环语句,For语句用于实现条件循环，即当条件成立时，执行语句集，否则跳出循环。 For (初始化；条件；增量) 语句集； ,11.3.4 while循环,该语句与for语句一样，当条件为真时，重复循环；否则循环退出。 While(条件) 语句集； ,11.3.5 break语句,使用break语句可以使循环从for或while中跳出。 基本语法： break； 当程序遇到break语句时会跳出循环并执行下一条语句。,11.4 JavaScript常见对象,JavaScript可以根据需要创建自己的对象，从而扩大其应用的范围。 JavaScript中的对象是由属性和方法两个基本元素构成的。 11.4.1 对象属性的使用 对于对象的属性，可以通过3种方法进行引用。,eg:city是一个已经存在的对象，而name和date是它的属性，如果要对这两个属性赋值，可以采用如下3种方法:,使用点运算符 =北京； city.date=2008； 通过字符串的形式来实现 cityname=北京； citydate=2008； 通过对象的下标实现引用：通过数组的形式访问属性，可以使用循环操作获取其值。 city0=北京； city1=2008； function show(object) for(i=0;i2;i+) document.write(objecti);,11.4.2 对象方法的使用,在JavaScript中对象方法的引用非常简单。 语法：对象名.方法（）=函数名（） 然后再定义函数的具体功能即可实现对象方法的定义。 如果要直接调用已知对象的方法，可以直接使用点运算符。,eg:如要调用math对象中的cos（）方法，可使用如下方法引用： document.write(math.cos(30) document.write(math.sin(60),11.4.3 浏览器的内部对象,使用浏览器的内部对象可实现与HTML文档进行交互。 浏览器的内部对象主要包括以下几个： 浏览器对象：navigator 文档对象：document 窗口对象：window 位置对象：location 历史对象：history,浏览器对象：navigator,navigator对象可用来存取浏览器的相关信息。,文档对象：document,JavaScript是基于对象的脚本编程语言，它的输入输出是通过对象来完成的。其中输出是通过document对象完成的。 Document对象有以下方法： 输出显示write() ：该方法主要用来实现在Web页面上显示输出信息。,窗口对象：window,JavaScript的输出可通过document对象的方法来完成，而输入则可以通过window对象来实现。 常用窗口对象window的prompt方法向浏览器输入信息。, var test=mpt(“请输入数据：“); document.write(“输入的信息是：“+ test); ,Window对象的常用方法,open（）：窗口特征是个可选参数，是对新打开的窗口外观进行设定，详见如下说明。NewObject是一个对象的名称，代表新开的窗口，这与窗口名称在意义上是不一样的，对象可以控制一个窗口，但名称只是个参考的说明而已。 Toolbar：决定要不要显示工具栏。yes、no Location：决定要不要显示地址栏。yes、no Direction：决定要不要显示浏览器窗口中的链接栏。yes、no Status：决定要不要显示浏览器窗口的状态栏。yes、no,Menubar：决定要不要显示菜单栏。yes、no Scrollbars：决定要不要显示滚动条。yes、no Resizeable：决定是否允许用户在浏览过程中改变窗口的大小 Width：设定新浏览窗口的宽度，输入参数为数值，以点数为单位 Height：设定新浏览窗口的高度。输入参数同上 Top：设定新窗口与屏幕上边界的距离。输入参数同上 Left：设定新窗口与屏幕左边界的距离。输入参数同上。 如果没有任何参数设置，则默认参数值为“yes“。但一旦设置了其中一个参数，那么其他没有设定的参数就会默认设定为no。,历史对象：history,history对象是指浏览器的浏览历史。 history对象常用的方法如下： Back():后退，与单击“后退”按钮是等效的。 Forward():前进，与单击“前进”按钮是等效的。 go():该方法用来进入指定的页面。, history对象 点击这里 “ onClick=“history.forward()“ ,11.4.4 JavaScript的内建对象,Date对象 Math对象,Date对象,对象类型 Date对象是一个动态对象，在使用时必须先实例化。 比如：mydate= new date(),常用的Date对象的方法, date对象 Var mydate= new date(); Var year=mydate.getyear(); Document.write(“客户机时间的年份是”+year); ,Math对象是一个静态对象。 Math对象的属性,Math对象,常数列表,常用的Math对象的方法, date对象 var test; test=-1; document.write(“圆周率是”+Math.pi+“正玄值是”+Math.abs(test); ,11.5 JavaScript事件,JavaScript事件主要包括3类：超链接事件、浏览器事件、界面事件。 11.5.1 单击事件 用户单击鼠标按键时可产生onclick事件，同时onclick指定的事件处理程序或代码将被调用执行。 语法：onclick=函数或处理语句, onClick单击事件 ,11.5.2 onselect事件,onselect事件是指当文本框中的内容被选中时所发生的事件。 语法： onselect=函数或处理语句, onClick单击事件 ,11.5.3 onfocus事件,onfocus事件是指当光标置于文本框中时所发生的事件。 语法： onfocus =函数或处理语句, onClick单击事件 ,11.5.4 onload事件,当页面文件载入时，产生该事件。 语法： onload =函数或处理语句,