JS基础教程--零基础学JavaScript
合集下载
相关主题
- 1、下载文档前请自行甄别文档内容的完整性，平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益，请联系客服反馈,我们会尽快为您处理(人工客服工作时间：9:00-18:30)。
JS 函数——Example
• Example <html> <head> <script type="text/javascript"> function displaymessage() { alert("Hello World!") } </script> </head> <body> <form> <input type="button" value="Click me!" onclick="displaymessage()"> </form> </body> </html>
JS基础教程
JS教程——目录（1）
• • • • • • • • • • • JS 介绍 JS 怎样使用 JS 在哪使用 JS 变量 JS 条件语句 JS 操作符 JS 函数 JS 循环 JS For...In JS 事件 JS 字符串
JS教程——目录（2）
• • • • JS Date JS Array JS Boolean JS Math
JS 变量——变量的寿命（有效 时间和范围）
JS 条件语句
• JS中的条件语句一般用在针对不同的条件来执行 不同的动作。在JS中有以下一些假设（条件）语 句：
if 语句 - 这条语句一般是在代码在只有一个状态为真的 情况下就执行的时候使用。 if...else 语句 - 两个状态，一种为真，还有种不为真， 分别执行不同动作。 if...else if....else 语句 - 你想在多个条件中选择一个或 几个去执行，就用这个。 Switch 语句 - 在许多条件中选择一个去执行，用这个 。
• 语法： if (condition) { code to be executed if condition is true } else { code to be executed if condition is not true }
wenku.baidu.com
JS 条件语句——If...else if...else
• 语法： if (condition1) { code to be executed if condition1 is true } else if (condition2) { code to be executed if condition2 is true } else { code to be executed if condition1 and condition2 are not true }
JS 在哪使用
• Head部分 将脚本中的函数插入head部分，这样就可以确保函数在被 调用前已经加载完成。 • Body部分 Body部分中的脚本将在页面加载到时被执行。在页面中插 入脚本，脚本将伴随页面一起加载。 • 外部脚本 调入外部脚本。将JavaScript写在一个外部文件中，并将 其保存为一个以.js为扩展名的外部 JavaScript 文件。
JS 怎样使用——实例
• Example： <html> <body> <script type="text/javascript"> document.write("Hello World!") </script>
</body> </html>
JS 怎样使用
• 用分号来终止语句？ 与C++和Java语言一样，JavaScript也是使 用分号来结束一条语句。 许多的程序员在写JavaScript时都有使用分 号来结束语句的习惯，但一般情况下分号 只当你需要在同一行写入多条语句时才必 须使用。
JS 变量——给变量指定值
• 可以用这样的方法来给变量指定值： var strname = "JavaScript"
或者这样： strname = "JavaScript"
• 变量名称写在表达式的左边，你想要指定的值写 在右边。现在变量名称为"strname"的变量值为 "JavaScript"。
JS 条件语句——Switch
• 语法： switch(n) { case 1: execute code block 1 break case 2: execute code block 2 break default:
code to be executed if n is different from case 1 and 2 }
= 等于 != 不等于 > 大于 < 小于 >= 大于等于 <= 小于等于
JS 操作符——比较（关系）运 算符
JS 操作符——逻辑运算符
&& 与 || 或 ! 非
• • 要给两个字符串变量中间添加空格就得在表达式里插入空格，或在其 中的一个加上（空格）。Example ： txt1="What a very" txt2="nice day!" txt3=txt1+" "+txt2 Or txt1="What a very " txt2="nice day!" txt3=txt1+txt2 • 变量txt3为“What a very nice day!”
JS 条件语句——Switch
• 如果想在几个代码块中选择一个来运行就 使用switch(开关)语句。 • 它是这样工作的:首先，有唯一的一个表达 式 n (大多数为一个变量)，它是被赋过值的 。 接下来表达式将与每个case(事件)进行 比较。如果吻合就执行该事件内的代码块 。使用break来防止代码执行后自动转向下 一个事件。
JS 介绍
• JS（JavaScript的缩写）是WEB脚本语言 。 JavaScript在成千上万的WEB页中用来增加 设计效果，校验表单，辨别浏览器，建立 cookies等等。 • JavaScript是互联网上最被广泛应用的脚本 语言，适用于IE，Mozilla，Firefox， Netscape，Opera等众多主流浏览器。
JS 操作符
• • • • • • 算术运算符 赋值运算符 比较（关系）运算符 逻辑运算符 串符（连接作用） 条件运算符
JS 操作符——算术运算符
+ 加 - 减 * 乘 / 除 % 余数 ++ 递增 -- 递减
JS 操作符——赋值运算符
Operator Example = x=y += x+=y -= x-=y *= x*=y /= x/=y %= x%=y Is The Same As x=y x=x+y x=x-y x=x*y x=x/y x=x%y
JS 条件语句——if 语句
• 语法： if (condition) { code to be executed if condition is true } • 注意：
if语句应该用小写，使用大写的话会引起JS错误。 要比较变量你就必须使用两个等号标记（==）！
JS 条件语句 ——If...else
从函数prod()返回的值就为6，它会存储在变量product中。
JS 循环
• 在JS中有两种循环：
for - 次数循环 while - 条件循环
JS 循环 —— For 循环
• 使用for循环一般是当你事先知道脚本应该执行几 次。
• 语法： for(var=startvalue;var<=endvalue;var=var+increme nt) { code to be executed }
如果变量visitor的值等于PRES那么greeting的值就为"Dear President "。如果不为PRES那么greeting的值就为"Dear"
JS 弹出框——警示框
如果你想保证让用户得到信息就使用警示 框。 当警示框弹出，用户必须按“OK”来继续。
• 语法： alert("sometext")
JS 在哪使用——body和head
• 位于 body 和 head 部分的脚本： <html> <head> <script type="text/javascript"> .... </script> </head> <body> <script type="text/javascript"> .... </script> </body>
JS 怎样使用
• 如何在HTML页面中插入JavaScript？ 我们通过 <script> 标签在HMTL页面中插入JavaScript（同 时我们也可以使用 type 属性来定义所要插入的脚本语言 ）。<script type=“text/javascript”>和</script>分别标记了 JavaScript代码的开始和结束。 格式如下： <html> <body> <script type=“text/javascript”> ... </script> </body> </html>
JS 函数——返回语句
• 返回语句用来指定从函数中返回的值，所以，要从函数里返回值就必 须使用返回语句 • Example：返回两个数字的乘积(a和b): function prod(a,b){x=a*breturn x} 当你调用上面的函数,你必须提供两个参数 product=prod(2,3)
JS 函数
• 函数是可再用的代码块，可以在事件触发或是被调用时来 执行。 • 要想让浏览器在加载完页面后马上执行脚本程序，你可以 将脚本写入一个函数内。
• 函数内的一些代码只有在某个事件触发或被调用的时候才 会被执行。
• 你可以在页面中的任何地方调用函数（可以用嵌入外部.js 文件的方式让其他页面也可以使用脚本） • 函数在页面的开始部分定义，在<head>区域。
JS 操作符——串符（连接作用 ） 要将两个或多个字符串变量衔接在一起的话就得使用 + 符号。
JS 操作符——条件运算符
• JS有根据条件不同给变量不同值的条件运算符。 • 语法： variablename=(condition)?value1:value2
• Example： greeting=(visitor=="PRES")?"Dear President ":"Dear "
JS 在哪使用——外部的脚本
• 外部的JavaScript <html> <head> <script src=“xxx.js"></script> </head> <body> </body> </html>
JS 变量
• • • • 变量定义 声明变量 给变量指定值 变量的寿命（有效时间和范围）
• 当你在function(函数)里指定一个变量，它就只能 在该函数内进行访问。当你离开函数变量就无效 了。这样的变量可以称作局部变量。你可以在不 同的函数内使用同样名称的变量，因为在函数中 只会辨认它所指定的变量（别的函数怎么定义是 不管的） • 如果你在函数外定义一个变量，那页面里所有的 函数都可以访问它。它的有效范围从指定开始直 到你关闭页面才会结束。
JS 在哪使用——head
• 在head部分中的脚本： <html> <head> <script type="text/javascript"> .... </script> </head>
JS 在哪使用——body
• body部分的脚本： <html> <head> </head> <body> <script type="text/javascript"> .... </script> </body>
JS 函数——定义一个函数
• 建立函数的语法： function functionname(var1,var2,...,varX) { some code } （var1,var2等一些变量或值可传递给函数使用。{和}定义了函数的开 始与结束。） • 注意：
没有参数的函数必须在函数名称后带上()； 调用的函数名必须和你建立的函数名相一致。
JS 变量——变量
变量是你想要存储数据的“容器”。变量的值可 以在脚本中改变。你可以调用变量的名称来看看 它的值或是改变它的值。 • 变量名称规则： 区分大小写的。 开始部分必须为一个字母或是下划线。
重点注意！JS是区分大小写的！
JS 变量——声明变量
• 你可以通过的var声明来建立一个变量： var strname = some value • 你也可以不用var来建立变量： strname = some value