JS基础教程零基础学JavaScript.ppt

1、JS基础教程,JS教程目录（1）,JS 介绍 JS 怎样使用 JS 在哪使用 JS 变量 JS 条件语句JS 操作符 JS 函数 JS 循环 JS For.In JS 事件 JS 字符串,JS教程目录（2）,JS DateJS ArrayJS BooleanJS Math,JS 介绍,JS（JavaScript的缩写）是WEB脚本语言。JavaScript在成千上万的WEB页中用来增加设计效果，校验表单，辨别浏览器，建立cookies等等。JavaScript是互联网上最被广泛应用的脚本语言，适用于IE，Mozilla，Firefox，Netscape，Opera等众多主流浏览器。,JS 怎样

2、使用,如何在HTML页面中插入JavaScript？我们通过 标签在HMTL页面中插入JavaScript（同时我们也可以使用 type 属性来定义所要插入的脚本语言）。和分别标记了JavaScript代码的开始和结束。格式如下：.,JS 怎样使用实例,Example：document.write(Hello World!),JS 怎样使用,用分号来终止语句？与C+和Java语言一样，JavaScript也是使用分号来结束一条语句。许多的程序员在写JavaScript时都有使用分号来结束语句的习惯，但一般情况下分号只当你需要在同一行写入多条语句时才必须使用。,JS 在哪使用,Head部分 将脚

3、本中的函数插入head部分，这样就可以确保函数在被调用前已经加载完成。Body部分 Body部分中的脚本将在页面加载到时被执行。在页面中插入脚本，脚本将伴随页面一起加载。外部脚本 调入外部脚本。将JavaScript写在一个外部文件中，并将其保存为一个以.js为扩展名的外部 JavaScript 文件。,JS 在哪使用head,在head部分中的脚本：.,JS 在哪使用body,body部分的脚本：.,JS 在哪使用body和head,位于 body 和 head 部分的脚本：.,JS 在哪使用外部的脚本,外部的JavaScript,JS 变量,变量定义声明变量 给变量指定值 变量的寿命（有效

4、时间和范围）,JS 变量变量,变量是你想要存储数据的“容器”。变量的值可以在脚本中改变。你可以调用变量的名称来看看它的值或是改变它的值。变量名称规则：区分大小写的。开始部分必须为一个字母或是下划线。重点注意！JS是区分大小写的！,JS 变量声明变量,你可以通过的var声明来建立一个变量：var strname=some value你也可以不用var来建立变量：strname=some value,JS 变量给变量指定值,可以用这样的方法来给变量指定值：var strname=JavaScript 或者这样：strname=JavaScript 变量名称写在表达式的左边，你想要指定的值写在右边。

5、现在变量名称为strname的变量值为JavaScript。,JS 变量变量的寿命（有效时间和范围）,当你在function(函数)里指定一个变量，它就只能在该函数内进行访问。当你离开函数变量就无效了。这样的变量可以称作局部变量。你可以在不同的函数内使用同样名称的变量，因为在函数中只会辨认它所指定的变量（别的函数怎么定义是不管的）如果你在函数外定义一个变量，那页面里所有的函数都可以访问它。它的有效范围从指定开始直到你关闭页面才会结束。,JS 条件语句,JS中的条件语句一般用在针对不同的条件来执行不同的动作。在JS中有以下一些假设（条件）语句：if 语句-这条语句一般是在代码在只有一个状态为真的

6、情况下就执行的时候使用。if.else 语句-两个状态，一种为真，还有种不为真，分别执行不同动作。if.else if.else 语句-你想在多个条件中选择一个或几个去执行，就用这个。Switch 语句-在许多条件中选择一个去执行，用这个。,JS 条件语句if 语句,语法：if(condition)code to be executed if condition is true 注意：if语句应该用小写，使用大写的话会引起JS错误。要比较变量你就必须使用两个等号标记（=）！,JS 条件语句 If.else,语法：if(condition)code to be executed if condi

7、tion is true else code to be executed if condition is not true,JS 条件语句If.else if.else,语法：if(condition1)code to be executed if condition1 is trueelse if(condition2)code to be executed if condition2 is trueelsecode to be executed if condition1 andcondition2 are not true,JS 条件语句Switch,如果想在几个代码块中选择一个来运行

8、就使用switch(开关)语句。它是这样工作的:首先，有唯一的一个表达式 n(大多数为一个变量)，它是被赋过值的。接下来表达式将与每个case(事件)进行比较。如果吻合就执行该事件内的代码块。使用break来防止代码执行后自动转向下一个事件。,JS 条件语句Switch,语法：switch(n)case 1:execute code block 1 break case 2:execute code block 2 breakdefault:code to be executed if n isdifferent from case 1 and 2,JS 操作符,算术运算符 赋值运算符 比较（

9、关系）运算符 逻辑运算符 串符（连接作用）条件运算符,JS 操作符算术运算符,+加-减*乘/除%余数+递增-递减,JS 操作符赋值运算符,Operator Example Is The Same As=x=y x=y+=x+=y x=x+y-=x-=y x=x-y*=x*=y x=x*y/=x/=y x=x/y%=x%=y x=x%y,JS 操作符比较（关系）运算符,=等于!=不等于 大于=大于等于=小于等于,JS 操作符逻辑运算符,&与|或!非,JS 操作符串符（连接作用）,要将两个或多个字符串变量衔接在一起的话就得使用+符号。要给两个字符串变量中间添加空格就得在表达式里插入空格，或在其中的

10、一个加上（空格）。Example：txt1=What a verytxt2=nice day!txt3=txt1+txt2Ortxt1=What a very txt2=nice day!txt3=txt1+txt2 变量txt3为“What a very nice day!”,JS 操作符条件运算符,JS有根据条件不同给变量不同值的条件运算符。语法：variablename=(condition)?value1:value2 Example：greeting=(visitor=PRES)?Dear President:Dear 如果变量visitor的值等于PRES那么greeting的值就

11、为Dear President。如果不为PRES那么greeting的值就为Dear,JS 弹出框警示框,如果你想保证让用户得到信息就使用警示框。当警示框弹出，用户必须按“OK”来继续。语法：alert(sometext),JS 函数,函数是可再用的代码块，可以在事件触发或是被调用时来执行。要想让浏览器在加载完页面后马上执行脚本程序，你可以将脚本写入一个函数内。函数内的一些代码只有在某个事件触发或被调用的时候才会被执行。你可以在页面中的任何地方调用函数（可以用嵌入外部.js文件的方式让其他页面也可以使用脚本）函数在页面的开始部分定义，在区域。,JS 函数Example,Examplefunct

12、ion displaymessage()alert(Hello World!),JS 函数定义一个函数,建立函数的语法：function functionname(var1,var2,.,varX)some code（var1,var2等一些变量或值可传递给函数使用。和定义了函数的开始与结束。）注意：没有参数的函数必须在函数名称后带上()；调用的函数名必须和你建立的函数名相一致。,JS 函数返回语句,返回语句用来指定从函数中返回的值，所以，要从函数里返回值就必须使用返回语句Example：返回两个数字的乘积(a和b):function prod(a,b)x=a*breturn x 当你调用上面

13、的函数,你必须提供两个参数product=prod(2,3)从函数prod()返回的值就为6，它会存储在变量product中。,JS 循环,在JS中有两种循环：for-次数循环 while-条件循环,JS 循环 For 循环,使用for循环一般是当你事先知道脚本应该执行几次。语法：for(var=startvalue;var=endvalue;var=var+increment)code to be executed,JS 循环 While 循环,当条件持续为真的时候循环执行相同的代码，这就是while循环的用途 while(var=endvalue)code to be executed 注

14、意：=可以比较任何申明（我的理解是不光可以比较数字类型，字符也可以比较）do.whlie是另外一种形式的while循环。条件判断在执行之后do code to be executed while(var=endvalue),JS 循环 特殊语句,break和continue是两个用在内部循环的特殊语句。Breakbreak命令会离开当前的循环并接着开始执行下面的循环（如果有的话）。Continuecontinue命令会跳出当前的循环并继续下面的值。,JS 循环 Break Example,var i=0for(i=0;i)ResultThe number is 0The number is 1

15、The number is 2,JS 循环 Continue Example,var i=0for(i=0;i),JS For.In,for.in声明通过一组元素或对象属性进行循环（重复）。在for.in循环躯干部分里的代码针对每个元素/属性执行一次。语法for(variable in object)code to be executed,JS For.In Example,Example 数组使用for.in循环var xvar mycars=new Array()mycars0=Saabmycars1=Volvomycars2=BMWfor(x in mycars)document.wri

16、te(mycarsx+),ResultSaabVolvoBMW,JS 事件,通过使用JS我们能够建立动态的web页面。JS能够察觉到事件有动作。web页中的每个元素都能够有触发JS函数的事件。事件例子：鼠标的点击 web页或是图象在加载的时候 移动到热点的时候（这里我怀疑Mousing是Moving）在HTML表单中选择一个输入框 提交一份HTML表单 一次击键注意：事件通常是用函数来组合使用的，而且在事件发生前函数是不会执行的！,JS事件参考,下面的列表列举了可以插入HTML标签中来定义事件动作的属性。onabort 图片下载被打断时 onblur 元素失去焦点时 onchange 框内容改变时 onclick 鼠标点击一个对象时 ondblclick 鼠标双击一个对象时 onerror 当加载文档或图片时发生错误时 onfocus 当元素获取焦点时 onkeydown 按下键盘按键时 onkeypress 按下或按住键盘按键时 onkeyup 放开键盘按键时,onload 页面或图片加载完成时 onmousedown 鼠标被按下时 onmousemove 鼠标被移动时onmouse