JavaScript教程.docx
- 文档编号:6238091
- 上传时间:2023-01-04
- 格式:DOCX
- 页数:11
- 大小:29KB
JavaScript教程.docx
《JavaScript教程.docx》由会员分享,可在线阅读,更多相关《JavaScript教程.docx(11页珍藏版)》请在冰豆网上搜索。
JavaScript教程
JavaScript教程
javascript的历史
javascript语言的前身叫作LiveScript。
自从Sun公司推出著名的Java语言之后,Netscape公司引进了Sun公司有关Java的程序设计概念,将自己原有的LiveScript重新进行设计,并更名为javascript。
这所以取名为javascript,原因就在于javascript作为一种嵌入HTML文档的、基于对象的脚本设计语言。
其中很大一部分的语法同Java语言很相似,而且javascript的设计可以使它很容易地同Java语言一同工作,它可以充分支持Java的applet小应用程序,Java的applet小应用程序也可以很方便地访问已有的javascript代码。
所以,也可以javascript看成是Java语言的某种简化版本。
javascript的优点
在javascript这样的用户端脚本语言语言出现之前,传统的数据提交和验证工作均由用户端浏览器通过网络传输到服务器上进行。
如果数据量很大,这对于网络和服务器的资源来说实在是一种无形的浪费。
而使用javascript就可以在客户端进行数据验证。
javascript可以方便地操纵各种浏览器的对象,可以使用javascript来控制浏览器的外观,状态甚至运行方式,可以根据用户的需要“定制”浏览器,从而使网页更加友好。
javascript可以使多种任务仅在用户端就可以完成而不需要网络和服务器的参与,从而支持分布式的运算和处理。
javascript的局限性
在WWW上有很多浏览器,如NetscapeNavigator,Mosaic和HotJava等,但每种浏览器支持javascript的程度是不一样的,支持和不完全支持javascript的浏览器在浏览一个带有javascript脚本的主页时,效果会有一定的差距,有时甚至会显示不出来。
当把javascript的一个设计目标设定为"Web安全性"时,就需要牺牲javascript的一些功能。
这时,纯粹的javascript将不能打开、读写和保存用户计算机上的文件。
它有权访问的唯一信息就是它所嵌入的那个Web主页中的信息,简言之,javascript将只存在于它自己的小小世界----Web主页里。
javascript的数据类型
数字
逻辑值
字符串
undefined类型
对象
javascript的变量
变量声明
在javascript中变量不用声明就可以使用,但事先进行变量声明是一种好的习惯。
可以使用var语句来进行变量声明。
只有当要在函数中声明一个局部变量时,才必须使用var语句。
语法如下:
var变量名=初值;
变量命名规则
第一个字符必须是一个字母(大小写均可)、或一个下划线(_)或一个美元符($);后续的字符可以是字母、数字、下划线或美元符。
不可以使用保留字作为变量的名字。
类型转换
javascript是一种对数据类型要求不太严格的语言。
可以不必指明一个变量的类型。
在程序的执行过程中,如果需要,javascript自动进行类型转换(也可进行强制转换)。
变量的作用范围
javascript有两种变量范围:
全局和局部。
如果在任何函数定义之外声明了一个变量,则该变量为全局变量,且该变量的值在整个持续范围内都可以访问和修改。
如果在函数定义内声明了一个变量,则该变量为局部变量。
每次执行该函数时都会创建和破坏该变量;且它不能被该函数外的任何事物访问。
一个局部变量的名称可以与某个全局变量的名称相同,但这是完全不同和独立的两个变量。
因此,更改一个变量的值不会影响另一个变量的值。
在声明局部变量的函数内,只有该局部变量有意义。
javascript的表达式
条件表达式
(条件)?
A:
B
赋值表达式
赋值操作符:
=
特殊赋值操作符:
a+=ba=a+b
a-=ba=a-b
a*=ba=a*b
a/=ba=a/b
a%=ba=a%b
a<<=ba=a<
a>>=ba=a>>b
a&=ba=a&b
a^=ba=a^b
a|=ba=a|b
javascript的操作符
代数操作符
符号描述
+加法
-减法
*乘法
/除法
%取模运算
++递增
--递减
-a 取反
位操作符
逻辑操作符
比较操作符
字符串操作符
操作符优先级
运算符描述
.[]()字段访问、数组下标以及函数调用
++---~!
typeofnewvoiddelete一元运算符、返回数据类型、对象创建、未定义值
*/%乘法、除法、取模
+-+加法、减法、字符串连接
<<>>>>>移位
<<=>>=小于、小于等于、大于、大于等于
==!
====!
==等于、不等于、恒等、不恒等
&按位与
^按位异或
|按位或
&&逻辑与
||逻辑或
?
:
条件
=oP=赋值、运算赋值
多重求值
javascript的基本语法
函数定义
function函数名称(参数表)
{
}
return语句
return表达式
条件语句
条件语句:
if(条件){执行语句1..}
else{执行语句2..}
例:
varaction="";
if((bb>5)||(nn>100))
{
action=("Go!
");
}else
{
action=("Stop!
");
}
循环语句
for循环
for语句指定了一个计数器变量,一个测试条件,以及更新该计数器的操作。
在每次执行循环之前(这称为一遍循环或一次重复),都将测试该条件。
在执行该循环后,计算机变量将在下一次循环之前被更新。
例:
for(vari=1;i {Sum+=i; T_sum[i]=Sum; } for...in循环 javascript提供了一种特别的循环方式来遍历一个对象的所有属性。 for...in循环中的循环计数器将遍历数组中的所有索引。 它是一个字符串,而不是数字。 例: for(jinobj) //obj是一个有多个属性的对象 { //各种javascript代码语句。 } while循环 while循环与for循环非常相似。 其不同之处是while循环没有内置的计数器或更新表达式。 如果已经有由变量赋值反映的变化条件,并且希望使用该条件来控制语句或语句块的循环执行,就可以使用while循环。 例: varstring=""; vari=10;//初始化计数器变量。 while(i>0) { string+="*"; i--;//更新计数器变量。 } theMoments="BLASTOFF! "; 对象操作语句 with语句 在with语句作用范围之内,凡是没有指出对象的所有属性和方法操作,均指的是默认的对象,这个默认的对象在with语句的开头给出。 with(对象名称){ 语句....} new语句 用new操作符为构造指定对象的一个实例。 例: myobj=newdate(); obj1=new.string; delete操作符 delete操作符可以删除一个对象的实例。 语法: delete实例名称。 this运算符 this运算符总是指当前的对象。 注释语句 在一行中跟在//后面的是注释。 在javascript程序中由符号/*和*/包含的部分是注释。 javascript的函数 内置函数 javascript语言中包括若干内置的函数。 有些可以用来处理表达式和特殊字符,以及将字符串转换为数值。 escape() 接受一个字符串,这个字符串可能有空格分号等字符,escape()把这个字符串转换成Cookie的内部表示方式。 eval() 接收一个字符串形式的表达式,并试图求出表达式的值。 如果传递给这个函数的参数中包含javascript命令,这些命令也可以被执行。 例: number=eval("3+6*8")将返回51。 parseFloat() parseFloat函数试图从一个字符串中提取一个浮点值。 parseInt() parseInt函数试图从一个字符串中提取一个整数。 unescape() 接受一个Cookie,把这个Cookier的内部表示方式转化成普通的字符串形式。 isNaN() isNaN函数可以测试这两个函数返回的结果是否为NaN.如果是,则返回true。 自定义函数 一个函数定义由一个function语句和一个javascript语句块组成。 函数定义语句 function函数名称(参数表) { 函数执行部分 } 函数的返回值 return语句用来指明将由函数返回的值。 如果省略了表达式,或者函数结束时根本没有return语句,则函数返回一个undefined值。 语法: return表达式; javascript的对象 (1) 在javascript中,对象本质上就是属性和方法的集合。 方法是作为某个对象成员的函数,属性是作为对象成员的一个值或一组值(数组或对象的形式)。 javascript支持三种对象: 内置对象、用户自定义对象以及浏览器对象、服务器上固有对象。 在javascript中,对象和数组是一样处理的。 可以按名称(使用对象名称,后跟一个圆点和属性的名称)来引用一个对象的任何成员(属性和方法),也可以按其数组下标索引来引用。 javascript中下标的是从0开始编号的,也可以用其名称来引用下标。 因此可以用多种方式来引用一个属性。 下面所有语句都是等价的。 myobj=someobj.width; myobj=someobj[3];//[3]是"width"的索引。 myobj=someobj["width"]; 以下是javascript的内置对象 String Math Math对象可以用来处理各种数学运算。 其中既定义了一些常用的数学常数,也定义了很多实现从三角到代数各种运算的方法。 Date javascript内置的Date对象可以用来处理所有有关日期与时间的操作。 Date对象定义的方法: mydate=newDate(); 自动存储了当前的日期和时间。 mydate=newDate(dateVal); dateVal表示一个从1970年1月1日0点0时开始到一个指定日期的毫秒数。 mydate=newDate(year,month,date[,hours[,minutes[,seconds[,ms]]]]); 产生一个指定日期和时间的对象。 Array 数组定义的方法: myarray=newArray()或myarray=newArray(7) javascript的数组实现是非常灵活的。 如果在数组定义的时候没有指定它的大小,那么根据程序的需要它可以自动地伸缩。 可以在数组中储存数字、字符、或其它对象。 此外,同一个数组中的元素也不必是同一个数据类型的,甚至可以让数组的一个元素又是一个数组。 例如: myarray=newArray(11,22,33,newArray("a","b")); 则: myarray(0)=11 myarray (1)=22 myarray (2)=33 myarray(3,0)=a myarray(3,0)=b 数组的Length属性: array对象中的length属性记录了当前数组中最大元素的下标加1的数字。 Event Event对象可以描述一个javascript中的事件,javascript解释器自动地在每一个事件发生的时候填充一个Event对象的实例,作为一个参数传送给事件处理函数。 RegEx javascript的对象 (2) 浏览器对象简介 navigator navigator对象提供关于整个浏览器环境的信息,比如浏览器的商标和版本。 部分属性: appNAME: 提供字符串形式的浏览器名称。 对于Navigator,appNAME="Netscape",对于MicrosoftInternetExplorer,appNAME="MSIE". appVersion: 反映浏览器的版本号。 language: (仅适用于NetscapeNavigation4.0以上)指出浏览器中当前的语言设定。 Platform: (仅适用于NetscapeNavigation4.0以上)指出当前的浏览器适用的平台名称。 Window 代表了当前运行的脚本所嵌入的HTML文档所在的窗口或者Frame。 Window对象包含了Frame的列表、历史记录列表、Document对象和Location对象。 window对象的方法: open(URL,WindowName,parameterList): open方法创建一个新的浏览器窗口,并在新窗口中载入一个指定的URL地址。 close(): close方法关闭一个浏览器窗口. alert(text): 弹出一个信息框. confirm(text): 弹出一个确认框. prompt(text,Defaulttext): 弹出一个提示框. setTimeout(expression,time): 定时设置,在一定时间后自动执行expression描述的代码,使用time设置时间,单位是毫秒. clearTimeout(timer): 取消以前的定时设置. back(): 指示浏览器载入历史记录中的上一个URL地址. forward(): 指示浏览器载入历史记录中的下一个URL地址. stop(): 指示浏览器停止网页的装载. location: 提供当前窗口的URL信息 history: 提供当前窗口的历史记录,可以在网页导航中发挥作用. closed: 一个指出窗口目前是否关闭的逻辑值. self: 引用当前文档对应的窗口. 提示框,确认框,输入框的用法: 提示框: 使用alert(text)方法创建,显示一条简短信息,只有一个OK按钮. 例: alert("你的输入是hello! "); 确认框: 使用confirm(text)方法创建,显示一条简短信息,有OK按钮和Cancel按钮. 例: confirm("确认? "); 输入框: 使用prompt(text,Defaulttext)创建,显示一条信息后,用户可以在一个文本输入框中输入一定的文本. 例: prompt("请输入您的姓名: ",""); Document 每一个Window对象都包含一个document对象。 它包含了链接的列表、“锚”的列表和Forms等的列表. 部分属性: title: 指出文档的标题. URL: 指出文档对应的URL. Cookie这个属性可以用来得到和创建Cookie信息. location: 保存文档的所有URL信息. 部分方法: clear(): 这个方法整个地清除浏览器窗口的内容. close(): 关闭缓冲区,将缓冲区现有的内容全部写入网页. write(): 向文档中写入文本. writeln(): 向文档中写入文本,并自动换行. getselection(): 返回当前用户选定的一串字符. JavaScrit中的事件处理 (1) 事件处理的基本概念 事件定义了用户与Web页面交互时产生的各种操作.例如,单击一个超级链接或按钮时,就产生一个事件,告诉浏览器发生了需要进行处理的单击操作(Click).事件不仅可以在用户交互过程中产生,而且浏览器自己的一些动作也可能产生事件.例如,浏览器载入一个网页的时候,就会产生一个Load事件.如果在javascript脚本程序中注册了这个事件处理函数,浏览器就可以在装入网页的时候自动地执行这个函数.我们把浏览器为了响应某个事件而进行的处理过程称为事件处理。 常用事件及处理 浏览器事件 Load事件 Load事件发生在浏览器完成一个窗口或一组帧的装载之后。 onLoad句柄在Load事件发生后由javascript自动调用执行。 可以用来完成网页中所作用数据的初始化,弹出一个提示窗口,显示版权或欢迎信息,弹出密码认证窗口,防止非授权的访问。 例: unload事件 unload事件发生在用户在浏览器的地址栏中输入一个新的URL,或者使用浏览器工具栏中的导航按钮,从而使浏览器试图载入一个新的网页。 在浏览器载入下个新的网页之前,会自动产生一个Unload事件,通知原有网页中的javascript脚本程序。 onUnload事件句柄同onload事件句柄下好构成一对功能相反的事件处理模式。 使用onLoad事件句柄可以初始化一个网页,而使用onUnload事件句柄则可以结束网页。 Submit事件 Submit事件在完成信息的输入,准备将信息提交给服务器处理时发生。 onSubmit句柄在Submit事件发生时由javascript自动调用执行。 onSubmit句柄通常在 窗体顶端 标记中声明。 例: checkdata 窗体顶端 输入一个1到9之间的数字: value="1"size="10"> 窗体底端 JavaScrit中的事件处理 (2) 鼠标事件 MouseDown 当按下鼠标上一个键的时候发生MouseDowm事件,在这个事件发生后由javascript自动调用onMouseDown句柄。 这个句柄适用于网页,普通按钮以及超级链接。 MouseUp 释放鼠标上一个键时发生MouseUp事件,在这个事件发生后由javascript自动调用onMouseUp句柄。 这个句柄适用于网页,普通按钮以及超级链接。 MouseOver 在鼠标扫过一个界面对象时发生MouseOver事件,在MouseOver事件发生时由javascript自动调用执行onMouseOver句柄。 这个事件适用于区域、层以及超级链接。 例: onMouseOver="window.status='javascript教程';return(true)">试一试 Click Click事件可以在两个地方发生。 首先,在一个表单上的某个对象被单击时可以发生。 其次,在单击一个超级链接时发生。 onClick事件句柄在Click事件发生时由javascript自动调用执行。 例: 你需要什么? 窗体顶端 onClick="select()">茶 onClick="select()">咖啡 要糖吗? 窗体底端 使用Cookie和URL存放用户信息 Cookie是怎么样工作的? 浏览器中可以保存一些用户信息,这些信息可以可能是用户在安装浏览器时输入的,也可能是在以后的浏览网页的过程中不断添加的。 HTML网页中的javascript程序可以通过Cookie获得这样的信息,并根据这些信息在程序中作出一些处理,有时这样的Cookie信息也被javascript程序按照一定的逻辑发送到服务器上。 浏览器中的Cookie信息采用数据对"名字=值"的形式存放信息。 如果有多个这样的数据对时,则数据对之间使用";"分隔。 例: 下面的代码可用来向浏览器写入一个Cookie(这个Cookie过期的日期设置为一个月以后): expiretime=newdate(); name="mary"; expires.settime(expires.gettime()+24*60*60*30*1000) document.cookie="uname="+escape(name)+";expires="+expires.toGMTstring(); 一个Cookie可以使用如下的参数: 只有第一个参数是必选的,其余的参数都是可选的。 name=value;这个参数后面加上一个value值,作为Cookie的主体,存放一定的信息。 expires=TIME;指示这个Cookie过期的时间。 一旦当前的时间超过这个时间,Cookie就处于无效的状态, 相当于从浏览器中删除了这个Cookie。 path=PATH;指示可以访问这个Cookie的路径。 domain=DOMAINNAME;这个参数只当服务器产生这个Cookie时才有效,指示产生Cookie的服务器的域名。 secure;指出只有存在安全的用户/服务器关系时才发送Cookie,也是一个出于安全性考虑的设计。 结束。
- 配套讲稿:
如PPT文件的首页显示word图标,表示该PPT已包含配套word讲稿。双击word图标可打开word文档。
- 特殊限制:
部分文档作品中含有的国旗、国徽等图片,仅作为作品整体效果示例展示,禁止商用。设计者仅对作品中独创性部分享有著作权。
- 关 键 词:
- JavaScript 教程