JS基础知识及应用.ppt
JS基础知识及应用,国际软件工程师培训学校,什么是 JavaScript?,JavaScript 被设计用来向 HTML 页面添加交互行为。JavaScript 是一种脚本语言(脚本语言是一种轻量级的编程语言)。JavaScript 由数行可执行计算机代码组成。JavaScript 通常被直接嵌入 HTML 页面。JavaScript 是一种编译语言(就是说,代码执行不进行预编译)。所有的人无需购买许可证均可使用 JavaScript。,JavaScript 能做什么?,JavaScript 为 HTML 设计师提供了一种编程工具 JavaScript 可以将动态的文本放入 HTML 页面 JavaScript 可以对事件作出响应 JavaScript 可以读写 HTML 元素 JavaScript 可被用来验证数据JavaScript 可被用来检测访问者的浏览器 JavaScript 可被用来创建 cookies,如何实现JavaScript?,HTML 的 标签用于把 JavaScript 插入 HTML 页面当中。document.write(Hello World!);,把JavaScript放置在何处?,位于 head 部分的脚本:.位于 body 部分的脚本:.使用外部 JavaScript:.注:当页面载入时,会执行位于 body 部分的JavaScript。当被调用时,位于 head 部分的 JavaScript 才会被执行。,JavaScript 语句,JavaScript 是由浏览器执行的语句序列。JS 语句是发给浏览器的命令。这些命令的作用是告诉浏览器要做的事情。这个 JS 语句告诉浏览器向网页输出“Hello world”:document.write(Hello world);JS 代码 JS代码是 JS语句的序列。document.write(This is a header);JS代码块JS可以分批地组合起来,代码块以左花括号开始,以右花括号结束。document.write(This is a header);,JavaScript 注释,JavaScript 注释可用于增强代码的可读性。单行注释以/开始。/这行代码输出标题:document.write(This is a header);/这行代码输出段落:document.write(This is a paragraph);多行注释以/*开头,以*/结尾。/*下面的代码将输出 一个标题和两个段落*/document.write(This is a header);document.write(This is a paragraph);,JavaScript 变量,变量是用于存储信息的容器x=5;y=6;JavaScript 变量名称的规则.变量对大小写敏感(y 和 Y 是两个不同的变量).变量必须以字母或下划线开始 声明(创建)JavaScript 变量您可以通过 var 语句来声明 JavaScript 变量:var x=5;var carname=“北京现代”;注:在为变量赋文本值时,请为该值加引号。,JavaScript 运算符,运算符=用于赋值。运算符+用于加值。如:var x;var y;var z;y=5;z=2;x=y+z;在以上语句执行后,x 的值是。y=“5”;z=“2”;x=y+z;在以上语句执行后,x 的值是。,JavaScript 算术运算符,给定 y=5,下面的表格解释了这些算术运算符:,JavaScript 赋值运算符,给定 x=10 和 y=5,下面的表格解释了赋值运算符:,JavaScript 比较运算符,给定 x=5,下面的表格解释了比较运算符:,JavaScript 逻辑运算符,给定 x=6 以及 y=3,下面的表格解释了逻辑运算符:,JavaScript 条件运算符,JavaScript 还包含了基于某些条件对变量进行赋值的条件运算符。语法:variablename=(condition)?value1:value2 例如:y=(X 5)?true:false;,JavaScript if.else 语句,if 语句 if(条件)条件成立时执行代码 if.else 语句 if(条件)条件成立时执行此代码 else 条件不成立时执行此代码 if.else if.else 语句if(条件1)条件1成立时执行代码 else if(条件2)条件2成立时执行代码 else 条件1和条件2均不成立时执行代码 注:请使用双等号(=)来比较变量!,JavaScript switch 语句,如果希望选择执行若干代码块中的一个,你可以使用 switch 语句:switch(n)case 1:执行代码块 1 break case 2:执行代码块 2 break default:如果n即不是1也不是2,则执行此代码,JavaScript 消息框,警告框 alert(文本);当警告框出现后用户需要点击确定按钮才能继续进行操作。确认框 confirm(文本);如果用户点击确认,那么返回值为 true。如果用户点击取消,那么返回值为 false 提示框 prompt(文本,默认值);如果用户点击确认,那么返回值为输入的值。如果用户点击取消,那么返回值为 null,JavaScript 函数,函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。如何定义函数 function 函数名(var1,var2,.,varX)代码 注:无参数的函数必须在其函数名后加括号。return 语句 return 语句用来规定从函数返回的值。function prod(a,b)x=a*b;return x,JavaScript For循环,JavaScript 中的循环用来将同一段代码执行指定的次数语法:for(变量=开始值;变量 var i=0 for(i=0;i),JavaScript While循环,while 循环用于在指定条件为 true 时循环执行代码。while(变量=结束值)需执行的代码 do.while 循环do 需执行的代码 while(变量=结束值)区别:dowhile至少执行一次。,JavaScript Break 和 Continue,Break使用 break 语句来终止循环 Continue 使用 continue 语句来终止当前的循环,然后从下一个值继续执行。var i=0 for(i=0;i),JavaScript 获取html元素,getElementById()getElementsByName()getElementsByTagName()查看例子,JavaScript 事件,事件是可以被 JavaScript 侦测到的行为。onload 和 onUnloadonFocus,onBlur 和 onChangeonSubmitonMouseOver 和 onMouseOut 查看例子,JavaScript trycatch,try.catch 的作用是测试代码中的错误.有两种在网页中捕获错误的方法:1.使用 try.catch 语句 2.使用 onerror 事件 try.catch 语句try/在此运行代码 catch(err)/在此处理错误 onerror 事件只要页面中出现脚步错误,就会产生 onerror 事件。onerror=handleErrfunction handleErr(msg,url,l)/Handle the error here return true or false 查看例子:1 2,JavaScript throw 声明,throw 声明的作用是创建 exception。语法:throw(exception)exception 可以是字符串、整数、逻辑值或者对象。throw 声明的作用是创建 exception(异常)。你可以把这个声明与 try.catch 声明配合使用,以达到控制程序流并产生精确错误消息的目的。请查看例子,JavaScript 特殊字符,你可以在 JavaScript 中使用反斜杠来向文本字符串添加特殊字符。,JavaScript 字符串对象,计算字符串的长度(xxx.length)toUpperCase()方法Match()方法indexOf()方法查看例子,JavaScript 日期对象,new Date()方法返回当日的日期getTime()方法计算从 1970 年到今天有多少年 setFullYear()方法得到精确的日期,有三个参数(年,月,日)toUTCString()方法当日的日期(根据 UTC)转换为字符串 getDay()方法显示星期,是数字当前时间加N天var myDate=new Date()myDate.setDate(myDate.getDate()+N)查看例子,JavaScript 数组(Array)对象,数组对象的作用是:使用单独的变量名来存储一系列的值。定义数组 var myArray=new Array()第一种:Var myArray=new Array();myArray0=“Java”;myArray1=“Javascript”;第二种:Var myArray=new Array(“java”,”javascript”);,JavaScript 浏览器检测,JavaScript Navigator 对象包含了有关访问者浏览器的所有信息.appName 保存浏览器类型appVersion 存有浏览器的版本信息(其他信息中的一项)查看例子,JavaScript Cookies,什么是cookie?cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时,就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。名字 cookie密码 cookie日期 cookie查看例子,谢 谢,