JavaScript基础、语法JS.doc

JavaScript基础、语法 JSJavaScript基础、语法(JS)2010-07-09 18：54 JavaScript在java ee开发过程中其着独特的作用，简单灵活的语法，立竿见影的效果，使其肆意运行在前台页面中。给程序员带来事半功倍的感觉，也给用户带来异常舒畅的体验。但是，也正是它简约，甚至有点荒诞的语法，使整天浸泡在严谨java语法中的程序员操作起来反而不太适应，就像手握大刀的武士在一片空地上跟苍蝇较劲，纵有千斤力也无济于事。其实，苍蝇也有它的活动规律。我就把我使用和收集的javaScript的点点滴滴记录下来，跟大家一起分享，有不对之处，还请大家互相指正。1.Java Script是一种脚本语言,其程序可以嵌入到HTML/XML页面中，被浏览器解释执行,解释到哪儿执行到哪儿.2.功能：增强页面动态效果实现页面与用户的实时交互3.Java Script的嵌入1.通过script/script,如：script language=javascript/或者使用type=text/javascript/*java script代码*/script一个HTML页面中可以有多个script/script标签对，而且各标签对之间可以互相访问，可以认为是同一段代码。2.Java Script代码可以出现的位置1).body中2).head中：主要是定义一些函数3).单独的外部文件中，如：script language=javascriptsrc=外部脚本文件的url/script 4.Java Script中的数据类型1基本数据类型整型浮点型字符型(包含了字符串类型)布尔型：true(0),false(非零)2.对象类型内置对象(String,Math,Date)浏览器对象(Window,Document,History,Forms,.)用户自定义对象5.变量1.命名规则：由字母,数字,下划线美元符($)组成,不能以数字开头。变量名区分大小写不允许使用JavaScript关键字做变量名2.变量声明时不指定类型,而具体的类型是由将来给它赋值时的赋值类型来决定通常用var来声明变量,也可以不声明而直接使用变量,但必须先赋值,再取其值。如：var a；/只声明，不赋值，但使用之前必须赋值var b=3.14；var c=你好；var d=5,e=6；/一次声明多个b=c+d；/结果b=你好5f=Hello；/不声明,直接赋值.注意：默认给声明成全局变量.document.write(f)；/不声明就使用,但是使用之前必须赋值3 undefined一般是使用了一个没赋值的元素4和java中变量不同的是,JS中变量可以重复声明；可以在使用中根据所赋值的类型来改变类型；作用域是从声明处到本代码块结束(注意JS中不是用划分代码块的,而是以函数为单位的)6.JavaScript中的自定义对象类型1定义的两种方式：1).使用new Object()如：var obj=new Object()；/这是一个空对象,后面可以设置对象的属性.obj.id=1；=yf；2).直接生成如：var teacher=id：1,name：yf；2使用的两种方式：1).对象名.属性名如：alert()；2).对象名属性名如：alert(objname)3对象中的方法：用对象的属性来保存外部定义的方法.如：obj.getName=getName；function getName()return ；7.JavaScript关键字break delete function return typeof case do if switch var catch else in this void continue false instanceof throw while debugger finally new true with default for null try 8.JavaScript常量1.整型八进制：012,027(0开头)十进制：3,200十六进制：0x12,0X4a(0x或者0X开头)这些进制的数据在显示的时候都是以十进制的形式呈现给用户2.浮点型：3.14,2.1e3,2e4(科学计数法的表示)3.布尔型：true,false 4.字符型1).单个字符：a字符串：china,但是JS也允许用china,这个很不容易理解，不过通常还是用china2).转义字符常量：n(换行符),t(制表符),(双引号)5.空值：null 9.JavaScript运算符1.算术运算符：2.位运算符+加法按位取反-减法&按位与*乘法|按位或/除法按位异或+增量/单目加左移-减量/单目减带符号右移%求余无符号右移(JavaScript也是采用补码的形式移位的,所以负数的和是不同的)3.逻辑运算符4.扩展运算符！逻辑非+=a+=b-a=a+b&逻辑与-=a-=b-a=a-b|逻辑或*=a*=b-a=a*b逻辑异或/=a/=b-a=a/b%=a%=b-a=a%b 5.比较运算符！=a！=b-a=a！b大于&=a&=b-a=a&b=大于等于|=a|=b-a=a|b小于=a=b-a=ab=小于等于=a=b-a=a b！=不等于=a=b-a=a b=等于(变量值相等就可以)=a=b-a=a b=全相等(表示两个变量的值相等,变量的类型也相同)6.赋值运算符=7.三目运算符?：8.字符串连接符+,+=10.表达式var s1=3+5+hello/结果：8hello var s2=hello+3+5/结果：hello35 11.流程控制1.分支语句：1).if-else 2).switch 2.循环语句1).for 2).while 3).do-while 4).for-in，如：script document.write(hr for-in循环：)；document.write(ul)；/JavaScript中用HTML的元素时,要输出这个元素才行var a=new Array(3)；a0=香蕉；a1=苹果；a2=犁；for(var sin a)document.write(li+as+/li)；document.write(/ul)；/script 3.特殊流程控制1).break跳出整个循环2).continue跳出本次循环12.数组1.数组的声明方式var a1=new Array()；/创建一个数组，包含0个元素,长度为0 var a2=new Array(size)；/创建一个数组,长度为size a20=1；a21=2；.,a2size-1=size；var a3=new Array(v1,.,vn)；/创建一个数组,并且静态初始化,没初始化的就按照undifined处理var a4=1,2,false,aa,null；/元素类型可以不一致2.数组的长度会自动调整,最终长度由初始化长度决定。3.数组元素的访问采用数组名下标的形式,有效下标为0length-1 13.函数1.函数定义：1).传统方法function函数名(参数列表)函数体代码return语句(可选)说明：JavaScript函数在定义时不需要指定返回值类型和是否有返回值参数列表也可以不指定类型2).构造方法方式var f=new Function(参数列表,方法体)；/参数列表可选,最后一个是方法体.2.函数使用：1).函数名(实参列表)；/所传实参个数可以和函数定义的参数个数不一样,按照就前原则使用2).函数名-并不表示函数调用,而是代表函数的定义,相当于java中的引用或者C+中的指针,指向函数3.内联函数：函数中定义函数,但此函数只能在外函数中调用.如：function outterFun()alert(OutterFun！)；function InnerFun()alert(InnerFun！)；outterFun()；14.事件及事件处理机制JavaScript中常用事件类型onClick组件被单击onDbclick组件被双击,如：input type=buttonname=b1value=开始测试onClick=test1()onLoad页面装载onUnload页面卸载,如：body onLoad=sayHello()OnUnload=sayBye()onChange组件内容或条目选种状态发生改变鼠标移入鼠标移出鼠标按下鼠标松开onMousemove鼠标移动，如：function move(x,y)mypic.style.left=x；mypic.style.top=y；body onMousemove=move(event.x,event.y)正文信息：div class=mystyleid=mypicimg src=mypic.gif/div/body onFocus成为焦点onBlur当对象失去焦点，如：username：input type=textname=usernamevalue=请输入您的姓名.onFocus=clear1()onBlur=show()/onscroll页面滚动onsubmit表单提交.但是它触发函数时必须用：return函数(参数列表),只有当函数返回true时表单才能提交成功；否则,提交失败.15.JavaScript中常用对象1.数学对象Math内置对象Math提供常规的数学运算方法和数学常量PI,E,abs()-绝对值,sin(),cos(),round()-截断操作,sqrt()-开方,pow()-幂运算,random()-产生随机数2.时间对象Date使用前需要声明/创建时间对象：var currentTime=new Date()；getYear()setYear()-获取/设置年信息getMonth()setMonth()-获取/设置月信息(月份是从011对应112月)getDate()setDate()-获取/设置日信息getDay()-获取星期几getHours()setHours()-获取/设置时信息getMinutes()setMinutes()-获取/设置分信息getSeconds()setSeconds()-获取/设置秒信息getTime()setTime()-获取/设置距离1970年0点0分0秒0毫秒的毫秒数3.字符串对象String length-属性,字符串长度charAt(idx)-返回指定下标处的字符indexOf(chr)-返回指定字符串的子串在当前字符串中第一次出现时的下标indexOf(chr,fromIdx)-从指定下标开始第一次出现的下标lastIndexOf(chr)-子串最后一次出现的下标substring(m,n)-取子串(从下标为m处字符到下标为n的字符,包含m,不包含n)substring(m)-取子串(从下标为m处一直到结尾,包含m)toLowerCase()-转换成小写toUpperCase()-转换成大写16.系统函数系统函数不从属于任何的对象,可以在JavaScript代码中的任何位置直接使用1.eval(str)计算字符串形式给出的表达式的值2.parseInt(str)把字符串解析成整数,默认按照十进制,但若是0开头则按八进制，若是0x开头则按十六进制parseInt(str,radix)按指定进制,把字符串解析成整数,即把str当成radix进制翻译成十进制parseFloat(str)把字符串解析成浮点型数值以上方法，参数可以是表达式，在解析过程中如果遇到错误(出现非法字符)，则把已解析的返回；如果第一个就解析错了，则返回NaN(非数值型)isNaN(v)判断参数是否为NaN 17.浏览器对象也是JavaScript的内置对象，可以实现浏览器与HTML页面之间的交互1.window对象代表当前窗体,是浏览器其它对象共同的祖先，所以可以通过它来访问其它浏览器对象及窗口中发生的事件信息，一般在JavaScript中可以省略Window对象.浏览器打开HTML文件时通常就会创建一个Window对象如果浏览器划分成多个Frame时，每个Frame都有一个Window，但这些Window之间可能存在隶属关系1).alert()如：window.alert(姓名不能为空！)；2).open(URL,windowName,parameterList)-打开一个窗口,显示一个URL指定的一个页面，windowName窗口名字，parameterList窗口参数如：window.open(ShiZhong.html,myAdvWindow,toolbar=no,left=300,top=200,menubar=no,width=250,height=200)；3).close()-关闭一个窗口如：window.close()4).prompt(text,Defaulttext)-弹出一个文本输入框如：var name=mpt(请输入您的姓名,)；5).confirm(text)-弹出一个确认窗口如：var flag=window.confirm(确定要删除此记录吗?)；if(flag)document.form1.submit()；6).setInterval(func,timer)-指定时间间隔执行任务如：window.setInterval(showTime(),1000)；7).clearInterval(timer)-清楚任务2.Document对象表示当前的页面,是Window对象的属性write(.)方法：在窗口中显示内容.3.Location对象表示当前打开的URL window.location=targetUrl/这条语句一旦被执行，就转向targetUrl指向的页面，实现了个页面转向reload()/重新加载当前页面，即刷新当前页面4.History对象go(index)-表示前进back()-后退forward()5.arguments对象用在函数中,是存放调用函数时传进来的参数组成的数组.6.Navigator对象当前浏览器的信息，也是Window对象的属性,它封装了当前浏览器的相关信息appName appVersion language platform收集的javascript的一些基础知识做个归纳，并在此与大家一起分享。1.document.write()；为输出语句2.JS中的注释为/3.传统的HTML文档顺序是：document-html-(head,body)4.一个浏览器窗口中的DOM顺序是：window-(navigator,screen,history,location,document)5.得到表单中元素的名称和值：document.getElementById(表单中元素的ID号).name(或value)6.一个小写转大写的JS：document.getElementById(output).value=document.getElementById(input).value.toUpperCase()；7.JS中的值类型：String,Number,Boolean,Null,Object,Function8.JS中的字符型转换成数值型：parseInt(),parseFloat()9.JS中的数字转换成字符型：(+变量)10.JS中的取字符串长度是：(length)11.JS中的字符与字符相连接使用+号.12.JS中的比较操作符有：=等于,！=不等于,=,.=13.JS中声明变量使用：var来进行声明14.JS中的判断语句结构：if(condition)else15.JS中的循环结构：for(initial expression；condition；upadte expression)inside loop16.循环中止的命令是：break17.JS中的函数定义：functionfunctionName(parameter,.)statements18.当文件中出现多个form表单时.可以用document.forms0,document.forms1来代替.19.窗口：打开窗口window.open(),关闭一个窗口：window.close(),窗口本身：self20.状态栏的设置：window.status=字符；21.弹出提示信息：window.alert(字符)；22.弹出确认框：window.confirm()；23.弹出输入提示框：mpt()；24.指定当前显示链接的位置：window.location.href=URL25.取出窗体中的所有表单的数量：document.forms.length26.关闭文档的输出流：document.close()；27.字符串追加连接符：+=28.创建一个文档元素：document.createElement(),document.createTextNode()29.得到元素的方法：document.getElementById()30.设置表单中所有文本型的成员的值为空：varform=window.document.forms0forvari=0；i！-/-49.引用一个文件式的JS：script type=text/javascriptsrc=aaa.js/script 50.指定在不支持脚本的浏览器显示的HTML：noscript/noscript 51.当超链和ONCLICK事件都有时,则老版本的浏览器转向a.html,否则转向b.html.例：a href=a.htmlonclick=location.href=b.html；return falsedfsadf/a 52.JS的内建对象有：Array,Boolean,Date,Error,EvalError,Function,Math,Number,Object,RangeError,ReferenceError,RegExp,String,SyntaxError,TypeError,URIError53.JS中的换行：n54.窗口全屏大小：script functionfullScreen()this.moveTo(0,0)；this.outerWidth=screen.availWidth；this.outerHeight=screen.availHeight；window.maximize=fullScreen；/script 55.JS中的all代表其下层的全部元素56.JS中的焦点顺序：document.getElementByid(表单元素).tabIndex=157.innerHTML的值是表单元素的值：如p id=parahow are em you/emp/p,则innerHTML的值就是：how are em you/em 58.innerTEXT的值和上面的一样,只不过不会把em这种标记显示出来.59.contentEditable可设置元素是否可被修改,isContentEditable返回是否可修改的状态.60.isDisabled判断是否为禁止状态.disabled设置禁止状态61.length取得长度,返回整型数值62.addBehavior()是一种JS调用的外部函数文件其扩展名为.htc63.window.focus()使当前的窗口在所有窗口之前.64.blur()指失去焦点.与FOCUS()相反.65.select()指元素为选中状态.66.防止用户对文本框中输入文本：onfocus=this.blur()67.取出该元素在页面中出现的数量：document.all.tags(div(或其它HTML标记符).length68.JS中分为两种窗体输出：模态和非模态.window.showModaldialog(),window.showModeless()69.状态栏文字的设置：window.status=文字,默认的状态栏文字设置：window.defaultStatus=文字.；70.添加到收藏夹：external.AddFavorite(中遇到脚本错误时不做任何操作：window.onerror=doNothing；指定错误句柄的语法为：window.onerror=handleError；72.JS中指定当前打开窗口的父窗口：window.opener,支持opener.opener.的多重继续.73.JS中的self指的是当前的窗口74.JS中状态栏显示内容：window.status=内容75.JS中的top指的是框架集中最顶层的框架76.JS中关闭当前的窗口：window.close()；77.JS中提出是否确认的框：if(confirm(Are you sure?)alert(ok)；elsealert(Not Ok)；78.JS中的窗口重定向：window.navigate(中的打印：window.print()80.JS中的提示输入框：mpt(message,defaultReply)；81.JS中的窗口滚动条：window.scroll(x,y)82.JS中的窗口滚动到位置：window.scrollby83.JS中设置时间间隔：setInterval(expr,msecDelay)或setInterval(funcRef,msecDelay)或setTimeout84.JS中的模态显示在IE4+行,在NN中不行：showModalDialog(URL,arguments,features)；85.JS中的退出之前使用的句柄：functionverifyClose()event.returnValue=we really like you and hope you will stay longer.；window.onbeforeunload=verifyClose；86.当窗体第一次调用时使用的文件句柄：onload()87.当窗体关闭时调用的文件句柄：onunload()88.window.location的属性：protocol(http：),hostname(),port(80),host(：80),pathname(/