JS基础教程--零基础学JavaScript

JS基础教程JS教程——目录（1）•JS介绍•JS怎样使用•JS在哪使用•JS变量•JS条件语句•JS操作符•JS函数•JS循环•JSFor...In•JS事件•JS字符串JS教程——目录（2）•JSDate•JSArray•JSBoolean•JSMathJS介绍•JS（JavaScript的缩写）是WEB脚本语言。JavaScript在成千上万的WEB页中用来增加设计效果，校验表单，辨别浏览器，建立cookies等等。•JavaScript是互联网上最被广泛应用的脚本语言，适用于IE，Mozilla，Firefox，Netscape，Opera等众多主流浏览器。JS怎样使用•如何在HTML页面中插入JavaScript？我们通过script标签在HMTL页面中插入JavaScript（同时我们也可以使用type属性来定义所要插入的脚本语言）。scripttype=“text/javascript”和/script分别标记了JavaScript代码的开始和结束。格式如下：htmlbodyscripttype=“text/javascript”.../script/body/htmlJS怎样使用——实例•Example：htmlbodyscripttype=text/javascriptdocument.write(HelloWorld!)/script/body/htmlJS怎样使用•用分号来终止语句？与C++和Java语言一样，JavaScript也是使用分号来结束一条语句。许多的程序员在写JavaScript时都有使用分号来结束语句的习惯，但一般情况下分号只当你需要在同一行写入多条语句时才必须使用。JS在哪使用•Head部分将脚本中的函数插入head部分，这样就可以确保函数在被调用前已经加载完成。•Body部分Body部分中的脚本将在页面加载到时被执行。在页面中插入脚本，脚本将伴随页面一起加载。•外部脚本调入外部脚本。将JavaScript写在一个外部文件中，并将其保存为一个以.js为扩展名的外部JavaScript文件。JS在哪使用——head•在head部分中的脚本：htmlheadscripttype=text/javascript..../script/headJS在哪使用——body•body部分的脚本：htmlhead/headbodyscripttype=text/javascript..../script/bodyJS在哪使用——body和head•位于body和head部分的脚本：htmlheadscripttype=text/javascript..../script/headbodyscripttype=text/javascript..../script/bodyJS在哪使用——外部的脚本•外部的JavaScripthtmlheadscriptsrc=“xxx.js/script/headbody/body/htmlJS变量•变量定义•声明变量•给变量指定值•变量的寿命（有效时间和范围）JS变量——变量变量是你想要存储数据的“容器”。变量的值可以在脚本中改变。你可以调用变量的名称来看看它的值或是改变它的值。•变量名称规则：区分大小写的。开始部分必须为一个字母或是下划线。重点注意！JS是区分大小写的！JS变量——声明变量•你可以通过的var声明来建立一个变量：varstrname=somevalue•你也可以不用var来建立变量：strname=somevalueJS变量——给变量指定值•可以用这样的方法来给变量指定值：varstrname=JavaScript或者这样：strname=JavaScript•变量名称写在表达式的左边，你想要指定的值写在右边。现在变量名称为strname的变量值为JavaScript。JS变量——变量的寿命（有效时间和范围）•当你在function(函数)里指定一个变量，它就只能在该函数内进行访问。当你离开函数变量就无效了。这样的变量可以称作局部变量。你可以在不同的函数内使用同样名称的变量，因为在函数中只会辨认它所指定的变量（别的函数怎么定义是不管的）•如果你在函数外定义一个变量，那页面里所有的函数都可以访问它。它的有效范围从指定开始直到你关闭页面才会结束。JS条件语句•JS中的条件语句一般用在针对不同的条件来执行不同的动作。在JS中有以下一些假设（条件）语句：if语句-这条语句一般是在代码在只有一个状态为真的情况下就执行的时候使用。if...else语句-两个状态，一种为真，还有种不为真，分别执行不同动作。if...elseif....else语句-你想在多个条件中选择一个或几个去执行，就用这个。Switch语句-在许多条件中选择一个去执行，用这个。JS条件语句——if语句•语法：if(condition){codetobeexecutedifconditionistrue}•注意：if语句应该用小写，使用大写的话会引起JS错误。要比较变量你就必须使用两个等号标记（==）！JS条件语句——If...else•语法：if(condition){codetobeexecutedifconditionistrue}else{codetobeexecutedifconditionisnottrue}JS条件语句——If...elseif...else•语法：if(condition1){codetobeexecutedifcondition1istrue}elseif(condition2){codetobeexecutedifcondition2istrue}else{codetobeexecutedifcondition1andcondition2arenottrue}JS条件语句——Switch•如果想在几个代码块中选择一个来运行就使用switch(开关)语句。•它是这样工作的:首先，有唯一的一个表达式n(大多数为一个变量)，它是被赋过值的。接下来表达式将与每个case(事件)进行比较。如果吻合就执行该事件内的代码块。使用break来防止代码执行后自动转向下一个事件。JS条件语句——Switch•语法：switch(n){case1:executecodeblock1breakcase2:executecodeblock2breakdefault:codetobeexecutedifnisdifferentfromcase1and2}JS操作符•算术运算符•赋值运算符•比较（关系）运算符•逻辑运算符•串符（连接作用）•条件运算符JS操作符——算术运算符+加-减*乘/除%余数++递增--递减JS操作符——赋值运算符OperatorExampleIsTheSameAs=x=yx=y+=x+=yx=x+y-=x-=yx=x-y*=x*=yx=x*y/=x/=yx=x/y%=x%=yx=x%yJS操作符——比较（关系）运算符=等于!=不等于大于小于=大于等于=小于等于JS操作符——逻辑运算符&&与||或!非JS操作符——串符（连接作用）•要将两个或多个字符串变量衔接在一起的话就得使用+符号。•要给两个字符串变量中间添加空格就得在表达式里插入空格，或在其中的一个加上（空格）。Example：txt1=Whataverytxt2=niceday!txt3=txt1++txt2Ortxt1=Whataverytxt2=niceday!txt3=txt1+txt2•变量txt3为“Whataveryniceday!”JS操作符——条件运算符•JS有根据条件不同给变量不同值的条件运算符。•语法：variablename=(condition)?value1:value2•Example：greeting=(visitor==PRES)?DearPresident:Dear如果变量visitor的值等于PRES那么greeting的值就为DearPresident。如果不为PRES那么greeting的值就为DearJS弹出框——警示框如果你想保证让用户得到信息就使用警示框。当警示框弹出，用户必须按“OK”来继续。•语法：alert(sometext)JS函数•函数是可再用的代码块，可以在事件触发或是被调用时来执行。•要想让浏览器在加载完页面后马上执行脚本程序，你可以将脚本写入一个函数内。•函数内的一些代码只有在某个事件触发或被调用的时候才会被执行。•你可以在页面中的任何地方调用函数（可以用嵌入外部.js文件的方式让其他页面也可以使用脚本）•函数在页面的开始部分定义，在head区域。JS函数——Example•Examplehtmlheadscripttype=text/javascriptfunctiondisplaymessage(){alert(HelloWorld!)}/script/headbodyforminputtype=buttonvalue=Clickme!onclick=displaymessage()/form/body/htmlJS函数——定义一个函数•建立函数的语法：functionfunctionname(var1,var2,...,varX){somecode}（var1,var2等一些变量或值可传递给函数使用。{和}定义了函数的开始与结束。）•注意：没有参数的函数必须在函数名称后带上()；调用的函数名必须和你建立的函数名相一致。JS函数——返回语句•返回语句用来指定从函数中返回的值，所以，要从函数里返回值就必须使用返回语句•Example：返回两个数字的乘积(a和b):functionprod(a,b){x=a*breturnx}当你调用上面的函数,你必须提供两个参数product=prod(2,3)从函数prod()返回的值就为6，它会存储在变量product中。JS循环•在JS中有两种循环：for-次数循环while-条件循环JS循环——For循环•使用for循环一般是当你事先知道脚本应该执行几次。•语法：for(var=startvalue;var=endvalue;var=var+increment){codetobeexecuted}JS循环——While循环•当条件持续为真的时候循环执行相同的代码，这就是while循环的用途while(var=endvalue){codetobeexecuted}•注意：=可以比较任何申明（我的理解是不光可以比较数字类型，字符也可以比较）•do...whlie是另外一种形式的while循环。条件判断在执行之后do{codetobeexecuted}while(var=endvalue)JS循环——特殊语句•break和continue是两个用在内部循环的特殊语句。•Breakbreak命令会离开当前的循环并接着开始执行下面的循环（如果有的话）。•Continuecontinue命令会跳出当前的循环并继续下面的值。JS循环——BreakExamplehtmlbodyscripttype=text/javascriptvari=0for(i=0;i=10;i++){if(i==3){break}document.write(Thenumberis+i)document.write(br/)}/script/body/htmlResultThenumberis0Thenumberis1Thenumberis2JS循环——ContinueExamplehtmlbodyscripttype=text/javascriptvari=0for(i=0;i=10;i++){if(i=