JavaScript实验实训内容

《JavaScript程序设计》实验实训内容JavaScript表达式和逻辑控制语句的使用实验一一．实验目的掌握JavaScript的变量；掌握JavaScript的数据类型；掌握JavaScript的运算符；掌握JavaScript的逻辑控制语句。二．实验内容1、声明一个变量str，为其赋值HelloWorld!，显示该值；改变该变量值为HelloChina!，然后再显示该值。2、将1~10之间的奇偶数分开，页面呈现方式如下：3、任意输入一个年份，判断是否为闰年。《JavaScript程序设计》实验实训内容实验二函数部分一．实验目的掌握JavaScript的常用函数；二．实验内容编写一个函数，在页面上输出1~1000之间所有能同时被3，5，7整除的证书，并要求每行显示6个这样的数。ex050303.htmhtmlheadscriptlanguage=javascript!--functionIsThatNumber(x){returnx%3==0&&x%5==0&&x%7==0;}//--/script/headbodyprescriptlanguage=javascript!--varn,nb=0;for(n=1;n1000;n++){if(IsThatNumber(n)){if(nb%60)document.write(,);nb++;document.write(n);if(nb%6==0)document.write(\n);}}document.write(\n\n);document.write(共有+nb+个数);//--/script《JavaScript程序设计》实验实训内容/pre/body/html实验三实验目的：常用函数的使用。实验内容：利用全局变量和函数，设计模拟幸运数字机游戏。设幸运数字为8，每次由计算机随机生成3个1~9之间的随机数，当这3个随机数中有一个数字为8时，就算赢了一次。Ex050309.htmlHTMLHEADMETAname=GENERATORcontent=MicrosoftFrontPage5.0METAname=ProgIdcontent=FrontPage.Editor.DocumentSCRIPTlanguage=javascriptvarwin_rate=0;//赢率varplay_times=0;//总次数varwins=0;//赢的次数varlast_digits;//上次数字串varlast_win;//上次是否赢?!--functionPlayOnce(){//模拟玩一次数字机游戏vari,digit;play_times++;last_digits=;last_win=false;for(i=0;i3;i++){digit=Math.floor(Math.random()*9)+1;last_digits+=digit;if(digit==8)last_win=true;}if(last_win)wins++;win_rate=Math.floor(100*(wins/play_times));《JavaScript程序设计》实验实训内容}//--/SCRIPT/HEADBODYPRESCRIPTlanguage=javascript!--while(true){PlayOnce();if(!confirm(last_digits+\n+(last_win?赢:输)+\n胜率+win_rate+%,继续吗?))break;}//--/SCRIPT/PRE/BODY/HTML事件与对象实验四实验目的：表单的设计。实验内容：设计一个表单，放入两个按钮，单击它们时将显示不同问候语。《JavaScript程序设计》实验实训内容S07_02.HTMHTMLHEADTITLE处理事件-HTML标记方式/TITLEscriptlanguage=javascriptfunctionhello_girl(){alert(小姐,您好!);}/script/HEADBODYFORMname=form1INPUTtype=buttonvalue=问侯先生name=hello1onclick=alert('先生,您好!');/PINPUTtype=buttonvalue=问侯小姐name=hello2onclick=returnhello_girl();/P/FORM/BODY/HTML实验五实验目的：内置对象的使用。实验内容：1．在页面中显示当天日期。S06_03.HTM：HTMLHEADTITLE使用new运算符/TITLE/HEADBODYscriptlanguage=javascriptvartoday;today=newDate();document.write(今天是+today.getFullYear()+年+(today.getMonth()+1)+月+today.getDate()+日);/script/BODY/HTML实验六实验目的：内置对象的使用。实验内容：2．在浏览器窗口的状态栏中显示当前浏览器的版本信息。《JavaScript程序设计》实验实训内容S06_02.HTMHTMLHEADTITLE访问对象的属性/TITLEscriptlanguage=javascriptwindow.status=navigator.appVersion;/script/HEADBODY/BODY/HTML实验七实验目的：内置对象的使用。实验内容：3．将用户输入的字符串反向输出到页面上，并且要求将其中的小写字母转换成大写字母。S06_07.HTMHTMLHEADTITLE使用String/TITLE/HEADBODYscriptlanguage=javascriptvarorigin_s,upper_s,i;origin_s=prompt(请输入一行文字:,);upper_s=origin_s.toUpperCase();for(i=upper_s.length-1;i=0;i--)document.write(upper_s.charAt(i));/script/BODY/HTML实验八实验目的：内置对象的使用。实验内容：《JavaScript程序设计》实验实训内容4．求PI的5次方，并四舍五入取整。S06_04.HTMHTMLHEADTITLE使用Math对象/TITLEscriptlanguage=javascriptalert(Math.round(Math.pow(Math.PI,5)));/script/HEADBODY/BODY/HTML实验九实验目的：内置对象的使用。实验内容：5．由图像表示日期。ch3_14.htmscriptlanguage=JavaScript!--varsWeek=newArray(日,一,二,三,四,五,六);varmyDate=newDate();//当天的日期varsYear=myDate.getFullYear();//年varsMonth=myDate.getMonth()+1;//月varsDate=myDate.getDate();//日varsDay=sWeek[myDate.getDay()];//星期document.write(imageDigits(sYear)+  +imageDigits(sMonth)+  +imageDigits(sDate)+br);//如果输入数是1位数，在十位数上补0functionformatTwoDigits(s){if(s10)return0+s;elsereturns;}//将数转换为图像，注意，在本文件的相同目录下已有0－9的图像文件，文件名为0.gif，《JavaScript程序设计》实验实训内容1.gif……以此类推functionimageDigits(s){varret=;vars=newString(s);for(vari=0;is.length;i++){ret+='imgsrc='+s.charAt(i)+'.gif';}returnret;}//--/scriptJavaScript对象的理解和使用实验十一．实验目的掌握JavaScript的常用的对象类型；掌握JavaScript对象属性和方法的引用方式；了解JavaScript对象的常用属性和方法；二．实验内容1、任意输入一个字符串，单击“确定”按钮，输出字符串的长度。2、猜数游戏，实现效果如下：《JavaScript程序设计》实验实训内容3、设计实现一个带开关的时钟。《JavaScript程序设计》实验实训内容JavaScript事件的理解和使用实验十一一．实验目的掌握JavaScript的常用的事件；掌握JavaScript事件的处理方式；了解如何通过HTML属性和JavaScript属性处理事件；二．实验内容1、设计实现一个页面，当进入页面时提示“您好，欢迎光临”，当离开页面时提示“您好，欢迎您下次再来”。2、设计实现如下页面，要求（1）单击“提交”按钮时逐一验证页面各项信息不允许为空；（2）如果哪一项信息不满足要求，页面焦点停留在该信息处；（3）单击“重置”按钮时，将页面各项元素信息清空。《JavaScript程序设计》实验实训内容JavaScript的浏览器对象模型实验十二一．实验目的掌握JavaScript浏览器对象的层次结构；掌握JavaScript浏览器对象的属性和方法；二．实验内容1、设计实现如下页面：（1）单击“修改年龄”按钮，弹出一个对话框：（2）单击“确定”按钮，将文本框内的年龄信息改为用户重新输入的信息；（3）单击“取消”按钮提示用户“您按了’取消’按钮”。《JavaScript程序设计》实验实训内容2、设计实现如下页面：（1）输入学生信息后，单击“提交”按钮，页面呈现方式如下：（2）单击“复位”按钮，页面呈现方式如下：《JavaScript程序设计》实验实训内容实验十三一．实验目的掌握JavaScript浏览器对象的层次结构；掌握JavaScript浏览器对象的属性和方法；二．实验内容设计一个含有一个表单的页面，并且在表单上放入一个文本框。编写程序，当鼠标在页面上移动时，鼠标的坐标将显示在这个文本框中。ex070303.htmHTMLHEADSCRIPTid=clientEventHandlersJSlanguage=javascript!--functiondocument_onmousemove(){form1.txtMousePosition.value=window.event.clientX+,+window.event.clientY;}//--/SCRIPT《JavaScript程序设计》实验实训内容SCRIPTlanguage=javascriptfor=documentevent=onmousemove!--returndocument_onmousemove()//--/SCRIPT/HEADBODYFORMid=form1PINPUTtype=textname=txtMousePositionsize=20/P/FORM/BODY/HTML1．在窗体中有两个多选列表，用户可以从左侧列表中选择任意项，添加到右侧列表中。反之亦然。ch4_07.htmhtmlheadscriptlanguage=JavaScript!--//moveList用于对两个多选列