太原理工大学Web程序设计基础-第三章高级Javascript

1TheJavaScriptLanguage田玉玲2基于对象的JavaScript语言3基于对象的JavaScript语言4基于对象的JavaScript语言5有关对象操作语句6Example函数是显示数组中的内容7Example函数是显示数组中的内容8有关对象操作语句9有关对象操作语句10有关对象操作语句11有关对象操作语句12对象属性的引用13对象属性的引用通过通过对点（.）运算符操作对属性赋值14对象属性的引用15对象属性的引用16对象方法的引用17常用对象的属性和方法18常用对象的属性和方法19常用对象的属性和方法string对象的属性该对象只有一个属性length，它表明字符串中的字符个数，包括所有符号。20Examplehtmlbodyscriptlanguage=javascriptvarstr=Chinaisgreat!document.write(p+str+/p)document.write(str.length)/script/body/htmlExample16.html21常用对象的属性和方法string对象的方法该对象的方法共有19个。主要用于有关字符串在Web页面这显示、字体大小、字体颜色、字符的搜索以及字符的大小写转换.22Examplehtmlbodyscriptlanguage=javascriptvartxt=Chinaisgreat!document.write(p+txt.fontcolor()+/p)document.write(p+txt.fontcolor(red)+/p)document.write(p+txt.fontcolor(blue)+/p)document.write(p+txt.fontcolor(green)+/p)/script/body/htmlExample17.htmlFontcolor()方法-----字体颜色方法23Examplehtmlbodyscriptlanguage=javascriptvarstr=Chinaisgreat!varpos=str.indexOf(great)if(pos=0){document.write(greatfoundatposition:)document.write(pos+br/)}else{document.write(greatnotfound!)}/script/body/htmlExample18.html从指定位置开始搜索great第一次出现的位置24Examplehtmlbodyscriptlanguage=javascriptvarstr=Chinaisgreat!document.write(str.match(great))/scriptpThisexampletestsifastringcontainsaspecifiedword.Ifthewordisfounditreturnstheword./p/body/htmlExample19.html25常用对象的属性和方法算术函数的math对象——静态对象主要属性和方法math中提供了6个属性绝对值：abs()正弦余弦值：sin(),cos()正切反正切：tan(),atan()四舍五入：round()平方根：sqrt()基于几个方次的值:Pow(base,exponent)26常用对象的属性和方法日期及事件对象date——动态性，即必须使用New运算符创建一个实例。MyDate=NewDate()Date对象没有提供直接访问的属性。只具有获取和设置日期和时间的方法。27获取日期的时间方法常用对象的属性和方法getYear():返回年数getMonth():返回当月号数getDate():返回当日号数getDay():返回星期几getHours():返回小时数getMinutes():返回分种数getSeconds():返回秒数getTime():返回分钟数28设置日期和时间：setYear():设置年setDate():设置当月号数setMonth():设置当月份数setHours():设置小时数setMinutes():设置分种数setSeconds():设置秒数setTime设置毫秒数常用对象的属性和方法29常用对象的属性和方法Javascript有一个计算时间的函数SetTimeout。SetTimeout让函数在一定的时间段内重新执行。SetTimeout（函数名，时间间隔，重复次数）；时间间隔单位是毫秒重复次数是大于0的数值30Examplehtmlheadscriptlanguage=javascriptfunctionhello(){alert(hello);setTimeout(hello();,2000);}/script/headbodyonLoad=hello();/body/htmlExample25.html31Example在页面上显示时间把时间写在表单中，每秒刷新一次时间setTimeout让函数在一定的时间段内重新执行。clearTimeout清除已设置的setTimeout对象。32htmlheadscriptlanguage=javascriptvartimer=nullfunctionstop(){clearTimeout(timer)}functionstart(){vartime=newDate()varhours=time.getHours()varminutes=time.getMinutes()minutes=((minutes10)?0:)+minutesvarseconds=time.getSeconds()seconds=((seconds10)?0:)+secondsvarclock=hours+:+minutes+:+secondsdocument.forms[0].display.value=clocktimer=setTimeout(start(),1000)}/script/headbodyonLoad=start()onUnload=stop()forminputtype=textname=displaysize=20/form/body/htmlExample26.html33常用对象的属性和方法TheArrayobjectisusedtostoreasetofvaluesinasinglevariablename.Eachvalueisanelementofthearrayandhasanassociatedindexnumber.YoucreateaninstanceoftheArrayobjectwiththe“new”keyword.34Examplehtmlbodyscriptlanguage=javascriptvarfamname=newArray(6)famname[0]=JanEgilfamname[1]=Tovefamname[2]=Hegefamname[3]=Stalefamname[4]=KaiJimfamname[5]=Borgefor(i=0;i6;i++){document.write(famname[i]+br)}/script/body/htmlExample27.html35Examplehtmlbodyscriptlanguage=javascriptvarfamname=newArray(3)famname[0]=Janifamname[1]=Tovefamname[2]=Hegedocument.write(famname.length+br)document.write(famname.join(.)+br)document.write(famname.reverse()+br)document.write(famname.push(Olx)+br)document.write(famname.pop()+br)document.write(famname.shift()+br)/script/body/htmlExample29.html用“.”将数组元素连接为字符串将数组元素顺序倒转将”Olx”加入到数组尾，然后返回新长度删除并返回数组最后一个元素删除并返回数组第一个元素36在JavaScript中创建新对象在JavaScript中创建一个新的对象是十分简单的。首先它必须定义一个对象，而后再为该对象创建一个实例。这个实例.就是一个新对象，它具有对象定义中的基本特征。对象的定义JavaScript对象的定义，其基本格式如下：FunctionObject（属性表）This.prop1=prop1This.prop2=prop2…This.meth=FunctionName1;This.meth=FunctionName2;…37在JavaScript中创建新对象Functionuniversity(name,city,creatDate,URL)This.name=nameThis.city=cityThis.creatDate=NewDate(creatDate)This.URL=URLthis.showuniversity=showuniversity;functionshowuniversity()for(varpropinthis)alert(prop+=“+this[prop]+””);38在JavaScript中创建新对象39HTMLDOM对象40HTMLDOM对象41HTMLDOM对象framedocumentnavigatorhistorylocationanchorappletareaformimagelinkresetbuttoncheckboxradiotextsubmitpasswordHTMLDOM代表整个HTML文档，用来访问页面中的所有元素包含客户端浏览器的信息。包含了浏览器窗口访问过的URL包含了当前URL的信息。42JavaScriptHTMLDOM对象43JavaScriptHTMLDOM对象document对象中的attribute属性44PropertyDescriptionalinkcolor被激活的链接(即用户点击了该链接)的颜色。vlinkcolor被访问过的链接的正常颜色Linkcolor是未被访问过的链接的正常颜色Bgcolor文档的背景颜色fgcolor文档的前景(即文本)颜色cookie一个特殊属性，允许JavaScript程序读写HTTPcookiedomain该属性使处于同一Internet域中的相互信任的Web服务器在网页间交互时能协同地放松某项安全性限制LastModified一个字符串，包含文档的修改日期referrer文档的URL,包含把浏览器带到当前文档的链接(如果存在这样的链接)title位于文档的标记title和title之间的文本URL一个字符串。声明了装载文档的URLbody引用HTML文档的body标记45ExamplehtmlheadtitleTest/title/headbodyscriptlanguage=javascriptdocument.write(document.domain+br)document.write(document.title+br)document.write(document.url+br)document.write(document.lastModified+br)/scrip