js基础完全代码

基础代码Js创建脚本块1引用内容程序代码script languagei JavaScript”代码写在这里面JavaScript/script隐藏脚本代码2引用内容程序代码」script languageJavaScriptn!-do cument.writ eHello;//-/script在不支持的阅读器中将不执行相关代码JavaScript阅读器不支持的时候显示3引用内容程序代码noscriptHello tothe non-JavaScript browser./noscript取消定时执行24引用内容程序代码script!-function hello{window.alert Hello;}”var myTimeout=window.setTimeout hello,5000;window.cl earTim eoutfmyTim eout;//-/script在页面卸载时候执行函数25引用内容程序代码n nbodyonUnload=functionName;Body ofthe page/body就这么回事:阅读器输出JavaScript2访问对象26document引用内容程序代码』script languageJavaScript^var myURL=document.URL;win dow.al ert myU RL;动态输出/script27HTML引用内容程序代码』u,script languageJavaScriptndocument.write pHeres someinformationabout thisdocument.writef;adocument.writef liReferringDocument:+document.referrer）；+u udocum ent.writ eliDomain:+document.domain+;udocument.writef liURL:+document.URL+;document.writef/script输出换行28引用内容程序代码a ndocument.writelnf stronga/strong;document.writeln b;输出日期29引用内容程序代码document:v/p;var thisDate=new DateQ;document.writethisDate.toStringO;/script指定日期的时区30引用内容程序代码』script languageJavaScriptn var my Offset=-2;var currentDate=new DateQ;var userOffset=currentDate.getTimezoneOffsetf/60;var timeZoneDifference=userOffset-myOffset;currentDate.s etHourscurrentDate.getHours+timeZoneDifference;document.write Thetime anddate inCentral Europeis:+currentDate.toLocaleStringO;/script设置日期输出格式31引用内容程序代码」script languageJavaScriptn varthisDate=new Date;var thisTimeString=thisDate.getHours+”:+thisDate.getMinutes;var thisDateString=thisDate.getFullYear++thisDate.getMonthf++thisDate.getDatef;document.writethisTimeString+“on”+thisDateString;/script读取参数32URL引用内容程序代码script languagei JavaScript”var urlParts=document.URL.splitf;var parameterParts=urlParts

[1].split;for i=0;iparam eterParts.length;i++{var pairParts=parameterParts[i].split;var pairName=pairParts

[0];var pairValue=pairParts[l];document.writepairName+”:+pairValue;}/script你还以为是无状态的么？HTML打开一个新的对象33document引用内容程序代码』script languageJavaScript^function newDocumentf{document.open;u ndocument.write pThis is aNew Document./p;document.clos e;/script页面跳转34引用内容程序代码』script languageJavaScript^window.location=;/script添加网页加载进度窗口35引用内容程序代码htmlhead=,Jscript languageJavaScript varplaceHolder=「!window.open holder.htrnP placeholder,width=200,height=2’；0/scripttitleThe MainPage/title/head=,body onLoadplaceHolder.closeQ pThis is themain page/p/body/html就这么回事图像JavaScript3:读取图像属性36引用内容程序代码vimg src=/imagel.jpgname=mylmage”a href=#,,onClick=window.alertdocument.myImage.width Width/a动态加载图像37引用内容程序代码』script languageJavaScript^mylmage=new Image;mylmage.src=Tellersl.jpg”;/script简洁的图像替换38引用内容程序代码script languageiJavaScript^rolllmage=new Image;rolllmage.src=rolllmagel.jpg”;defaultimage=new Image;defaultimage.src=imagel.jpg”;/scriptn a href=/myUrl“onMouseOver=document.mylmage.src=rolllmage.src;w nonMouseOut=document.mylmage.src=defaultlmage.src;vimg src=/imagel.jpgname=mylmage“width=100height=100border=0随机显示图像39引用内容程序代码」script languageJavaScript^var imageList=new Array;imageList[O]=imagel.jpg”;imageList[l]=image

2.jpg”;imageList

[2]=image

3.jpg”;imageList

[3]=image

4.jpg”;var imageChoice=Math.floorMath.random*imageList.length;document.write vimgsrc=+imageList[imageChoice]+/script函数实现的图像替换40引用内容程序代码script languagei JavaScriptn varsource=0;var replacement=1;function createRollOverforiginallmage.replacementimage{var imageArray=new Array;imageArray[source]=new Image;imageArray[source].src=originallmage;imageArray[replacement]=new Image;imageArray[replacement].src=replacementimage;return imageArray;}var rolllmage=createRollOver imagel.jpg rolllmagel.jpg;/script,J na href=#onMouseOver=document.mylmagel.src=rolllmagel[replacement],src;”onMouseOut=document.mylmage

1.src=rolllmage1[source].src;^w n n nimg src=/imagel.jpg”width=100name=mylmage1border=0/a引用内容程序代码script languageiJavaScriptn varimageList=new Array;imageList[O]=new Image;imageList[O].src=imagel.jpg”;imageList[l]=new Image;imageList[l].src=image

2.jpg”;imageList

[2]=new Image;imageList

[2].src=image

3.jpg”;imageList

[3]=new Image;imageList

[3].src=image

4.jpg”;function slideShowimageNumber{document.slideShow.src=imageList[imageNumber].src;imageNumber+=1;if imageNumberimageList.length{，u uwindow.setTimeout slideShow+imageNumber+3000;}}/script/headn wnbody onLoad=slideShow0img src=/imagel.jpg“width=100nname=slideShow”随机广告图片42引用内容程序代码』script languageJavaScriptn varimageList=new Array;imageList[O]=imagel.jpg”;imageList[l]=image

2.jpg”;imageList

[2]=image

3.jpg”;imageList

[3]=image

4.jpg”;var urlList=new Array;；urlList[O]=；urlList[l]=”；urlList

[2]=”；urlList

[3]=var imageChoice=Math.floorMath.random*imageList.length;adocument.write vahref=+urlList[imageChoice]+imgsrc=+a,imageList[imageChoice]+/a;/script就这么回事表单JavaScript4链接外部脚本文件4引用内容程序代码,,script language=JavaScript“src=”/“””/script注释脚本5引用内容程序代码//This is a commentdocument.write Hello;//This isa comment/*All ofthisis acomment*/输出到阅读器6引用内容程序代码u Mdocument.write strongHello/strong;定义变量7引用内容程序代码varmy Variable=some value”;字符串相加8引用内容程序代码；var myString=Stringl”+“String2”引用内容程序代码,form method=post“action=target.htmfname=thisForm”winput type=text name=myText”select name=mySelect”noption value=1”First Choice/optionwoption value=2Second Choice/option/selectbrninput type=submit”value=Submit Me”/form访问表单中的文本框内容44引用内容程序代码form name=my Forminput type=text name=myText”/form=,a href#,onClick=window.alertdocument.myForm.myText.value;Check Text Field/a动态复制文本框内容45引用内容程序代码form name=myForm”Enter someText:input type=text name=myText brCopy Text:input type=text name=copyText”/forma href=#onClick=document.myForm.copyText.value=document.mywF orm.myT ext.value;CopyTextField/a侦测文本框的变更46引用内容程序代码form name=myForm”wEnter someText:input type=text name=myText”onChange=alertwthis.value;/form访问选中的47Select引用内容程序代码form name=myForm”select name=mySelect”noption value=First Choicel/optionn,option value=Second Choice2/optionnoption value=Third Choice3/option/select/form=,a href#onClick=alertdocument.myForm.mySelect.value;CheckSelection List/a动态增加项48Select引用内容程序代码wform name=my Formselect name=mySelect”n noptionvalue=First Choicel/optionn optionvalue=Second Choice2/option/select/form script languageiJavaScript^document.myF orm.myS elect.length++;document.myForm.mySelect.options[docum ent.myForm.mySelect.length-l].text=3;document.myForm.mySelect.options[document.myForm.mySelect.length-1].value=Third Choice”;/script验证表单字段49引用内容程序代码script languageiJavaScriptn functioncheckFieldfield{if field.value=={window.alert Youmust entera valuein thefield;field.focusQ;}/scriptn nform name=myForm action=target.html”TextField:input type=text”n nnname=myField”onBlur=checkFieldthis brinput type=submit”/form验证项50Select引用内容程序代码function checkListselection{if selection.1ength==0{window.alert Youmust makea selectionfrom thelist.;return false;return true;动态变更表单的51action引用内容程序代码』,formname=myForm“action login.htmf nUsername:input type=text name=username brPassword:input type=password“name=password brninput type=button”value=Login”nonClick=this.form.submit!;ninput type=button”value=Register”onClick=this.form.action=register.html’;nthis.form.submit;input type=button”value=Retrieve Password”nonClick=this.form.action=password.html;wthis.form.submit;/form运用图像按钮52引用内容程序代码nform name=myForm“action=login.htrnl User name:inputtype=text name=username brPassword:inputtype=password“name=password brinputtype=image“src=/login.gif“vahie=Login”/form表单数据的加密53引用内容程序代码〈SCRIPT LANGUAGEiJavaScript!-function encryptitem{var newltem=”;for i=0;iitem.length;i++{newltem+=item.charCodeAti+;|return newltem;}function encryptFormmyForm{for i=0;imyForm.elements.length;i++{myF orm.elements[i].value=encrypt myForm,el ements[i].value;}}//-/SCRIPT=,J Jformname myForm onSubmit=encryptF ormthis;Jwindow,alert this.myFi eld.value;Enter SomeText:inputtype=text name=myFieldinput type=submit/form就这么回事窗口和框架JavaScript5:变更阅读器状态栏文字提示54引用内容程序代码」script languageJavaScriptn window,status=A newstatus message”;/script弹出确认提示框55引用内容程序代码』script languageJavaScript^var userChoice=window.confirm”Click OK or Cancel;if userChoice{document.writef“You choseOK;}else{document.writef,You choseCancel;提示输入56引用内容程序代码script languageiJavaScriptn varuserName=window.prompt PleaseEnter Your丁,JName”Enter Your Name Here;do cument.writ eYourNameis“+userName;/script打开一个新窗口57引用内容〃打开一个名称为的阅读器新窗口程序代码myNewWindow script languageiJavaScriptnwindow.open myNewWindow;/script设置新窗口的大小58引用内容程序代码script languageiJavaScriptn，,window.open myNewWindowheight=300width=300;,/script设置新窗口的位置59引用内容程序代码window.open myNewWindowheight=300,width=300Jeft=200,screenX=200,top=100,screenY=100;/script是否显示工具栏和滚动栏引用内容程序代码60』script languageJavaScriptnwindow.opentoolbar=no,menubar=no;/script是否可以缩放新窗口的大小61引用内容程序代码，J script languageiJavaScript”window.open,myNewWindow,resizable=yes;/script加载一个新的文档到当前窗口62引用内容程序代码=,J,a href#onClick=document.location=’125a.html OpenNewDocument/a设置页面的滚动位置63引用内容程序代码』假如是阅读器则script languageJavaScript^if document.all{//IE运用属性scrollTop document.body.scrollTop=200;〃假如是阅读器则运用属性}else{NetScape pageYOffsetwindow.pageY Offset=200;}/script在中打开全屏窗口64IE引用内容程序代码=,ahref#,onClick=window.openJnewWindow/fullScreen=yes;”Open a新窗口和父窗口的操作full-screen window/a65引用内容程序代码』script languageJavaScriptn//定义新窗口var newWindow=window.open“128a.html“newWindow”;在父窗口中关闭打开的新窗口在新窗口中newWindow.close;///script关闭父窗口程序代码往新窗口中写内容window.opener.closed66引用内容程序代码字符串搜寻9引用内容程序代码script languageiJavaScriptn!-var myVariable=Hello there”;var therePlace=myVariab1e.search there;document.writeth erePlace;//-/script字符串替换10引用内容程序代码；a vthisVar.replace!Monday Friday”格式化字串11引用内容程序代码』script languageJavaScript^!-var myVariable=Hello there”;document.writemyVariable.big+“vbr”;document.writemyVariable.blink+“vbr”;document.writemyVariable.bold+“vbr”;document.writemyVariable.fixed+“vbr”;n script language=JavaScriptn varnew Window=window.open““newWindow”;newWindow.document.open;newWindow.document.write Thisisanew window”;newWIndow.document.closef;/script加载页面到框架页面67引用内容程序代码frameset cols=50%J”n w,frame name=framel src=/“135a.htmf”nnn frame name=frame2src=/about:blank”/frameset在中加载中的页面framel frame2parent.frame

2.document.location=135b.html”;在框架页面之间共享脚本68引用内容假如在中文件中有个脚本framel html程序代码function doAlert{window.alert Frame1is loaded;那么在中可以如此调用该方法程序代码frame2〈nbody onLoad=parent.framel.doAlert;Thisisframe

2./body数据公用69引用内容可以在框架页面定义数据项，使得该数据可以被多个框架中的页面公用程序代码script languageiJavaScript”var persistentVariable=Thisisa persistentvalue”;/script frameset cols=50%J”〈frame name=frame1“src=/”138a.html””〈framename=frame2src=/“138b.html”/frameset这样在和中都可以运用变量frame1frame2persistentVariable框架代码库70引用内容依据以上的一些思路，我们可以运用一个隐藏的框架页面来作为整个框架集的代码库程序代码framesetcols=0,50%,*”nframe name=codeFrame“src=/“140code.html”,,,Jframe name=frame1src=/“140a.html””n,Jframe name=frame2src=/”140b.html””/framesetdocument.writemyVariable.fontcolor red+vbr”;document.writemyVariable.fontsize“18pt+“vbr”;a ndocument.writemyVariable.italics+br;a ndocument.writemyVariable.small+br;document.writemyVariable.strikef+“vbr”;document.writemyVariable.sub+“vbr”;document.writemyVariable.sup+;document.writemyVariable.toLowerCase+“vbr”;u ndocument.writemyVariable.toUpperCase+br;var firstString=My String”;var finalstring=firstString.bold.toLowerCaseQ.fontcolor“red;//-/script创建数组12引用内容程序代码script languageiJavaScriptn!—var myArray=new Array5;myArray[O]=First Entry”;；myArray

[1]=Second Entry”；myArray

[2]=Third Entry”；amyArray

[3]=Fourth Entry”；my Array

[4]=Fifth Entry”var anotherArray=new ArrayFirst Entry“SecondEntry”Third Entry”Fourth Entry“Fifth Entry;//-/script数组排序13引用内容程序代码』scriptlanguageJavaScript^!-var myArray=new Array5;myArray[O]=z”;myArray

[1]=c”;；myArray

[2]=d”myArray

[3]=a;；myArray

[4]=q”document.writemyArray.sort;//-/script分割字符串14引用内容程序代码script languageiJavaScript^var myVariable=a,b,c,d”;var stringArray=myVariable,split;document.writestringArray

[0];document.writ efstringArray

[1];document.writefstringArray

[2];document.writefstringArray

[3];//-/script弹出警告信息15引用内容程序代码」scriptlanguageJavaScript^!-；window.alert Hello”//-/script弹出确认框16引用内容程序代码scriptlanguageiJavaScript”!-var result=window.confirm ClickOK tocontinue;//-/script自定义函数17引用内容程序代码』scriptlanguageJavaScriptn!-function multiplefnumber1,number2{var result=numb er1*numb er2;return result;}//-/script调用函数18JS引用内容程序代码href=v#w naonClick=functionName Link text/ana href=/javascript:functionNam”Linktext/a在页面加载完成后执行函数19引用内容程序代码body onLoad=functionNameBody ofthe page/body条件推断20引用内容程序代码script!-var userChoice=window.confirm ChooseOKorCancel;var result=userChoice==trueOK:Cancel”;document.writeresult;//-/script指定次数循环21引用内容程序代码script!-var myArray=new Array3;；myArray

[0]=Item0”；myArray

[1]=Item1”；myArray

[2]=Item2”for i=0;imyArray.length;i++{document.writemyArray[i]+“vbr”;}//一〉设定将来执行22引用内容程序代码script!-function hello{u nwindow.alert Hello;},,window.setTimeout hello,5000;//-〉/script定时执行函数23引用内容程序代码script!-function hello{window.alertf;,window.setTimeout hello,,5000;},,window.setTimeout hello,5000;//一〉。