原版Javascript程序设计实验指导书.docx
?Javascript程序设计?实验指导书一、课程性质和教学目的JavaScrip是一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，内置 支持类型。它的解释器被称为JavaScript引擎，为浏览器的一局部，广泛用于客户端的脚 本语言，最早是在HTML （标准通用标记语言下的一个应用）网页上使用，用来给HTML网页 增加动态功能。学习Javascript必须理论联系实际，多做上机练习。只有在上机实验过程中才能真正 学会程序设计。本实验报告主要包括学期内各个实验的实验目的、实验内容、实验记录、 实验总结等，供学生学习记录，以提高学习效率。参加实验的学生应参照本报告手册的要 求，认真实验，如实填写实验数据，并对实验结果进展分析，阐述实验中所遇到的问题， 提出解决问题的方法。二、实验目的上机实验的目的不仅是为了验证教材和讲课的内容，或者验证自己所编写的程序正确与 否。学习程序设计上机实验的目的是：1 .加深对讲授内容的理解，尤其是一些语法规定，课堂讲授既枯燥无味又难以记忆，但 它们都很重要。能过屡次上机就能自然地、熟练地掌握。通过上机掌握语法是行之有效的方 法。2 .学会上机调试程序。即善于发现程序中的错误，并且能很快排除这些错误，使程序能 正确运行。要真正掌握这门课程，不仅应当了解和熟悉有关理论和方法，还要求自己动手实 现即会编程并上机调试通过。故应给予充分重视。调试程序固然可以借鉴他人的现成经历， 但更重要的是通过自己的直接实践来累积经历，而且有些经历是只能意会难以言传。调试程 序的能力是每个程序设计人员应当掌握的一项 基本功。3 .做实验时不要在程序通过后就认为搞定、完成任务了，而应当在己通过的程序甚而上 作一些改动（例如修改一些参数、增加程序一些功能、改变输入数据的方法等），以观察和 分析所出现的情况。三、上机实验前的准备工作实验前应做好准备工作，以充分利用有限的上机时间。准备工作至少包括：1 ,复习和掌握本实验有关的教学内容。2 .准备好上机所需的程序。初学者切忌不编写程序或抄别人的程序去上机，应从一开场 就养成严谨的科学作风。3 .对运行上可能出现的问题应事先作出估计；对程序中自己有疑问的地方，应作上记号， 以便在上机时给予注意。4 .根据实验内容认真准备实验程序及调试时所需的输入数据。5 .在上实验课之前必须写好预习报告编程题源程序用纸写好或画好程序流程图）6,填空与改错题等题要预先做好，上机时的工作只能是输入源程序和调试修改。7认真完成实验内容，得出正确的实验结果。实验完毕后总结实验内容、书写实验报告。8 .遵守实验室规章制度、不缺席、按时上、下机。四、实验环境实验内容1 .请设计一个页面，页面中有三个按钮，要求单击每个按钮的时候，那么在对应位置出现你 自己的姓名。单击文本框按钮，那么文本框中要出现你的名字，也就是。nclick点击按钮之后，通过函数 function,使得text的value值为你的名字。<br>单击alert按钮，那么弹出一个alert警告框，里面是你的名字。最后是div按钮，单击它那 么div中的内容换成你的名字，也就是这个div对应id的 document. getElementById("”).innerHTML="你的名字”2 .confirm的功能是弹出一个两选项的对话框，最重要的是，你点击确定或者取消按钮之 后，可以给出进一步的选择。请创立页面，要求是，修改此题的代码，使其功能为： 单击按钮，会弹出一句话：“你今天的心情是不是很好啊如果用户点击确定，那么弹出“那你请我吃饭好不好啊如果用户点击取消，那么弹出“那你是不是因为我没给你时机请我吃饭所以心情不好啊.自己创立一个文件，复制任务2的代码，然后自己编写程序，要求页面一开场弹出一个 confirm,然后用户点击确定或者取消之后，会再分别弹出内容不同的alert。3 .设计网页，实现的功能为：点击确定之后再出现一个confirm,看用户是否点击两次确 定。如果点击取消，那么以alert完毕。要求：修改代码，实现如下功能：一开场confirm提问：你是否喜欢红色如果用户点击确定，那么再一个confirm：你是否喜欢蓝色如果用户点击确定，那么弹出“你喜欢红色和蓝色如果用户点击取消，那么弹出“你喜欢红色不喜欢蓝色如果在“你是否喜欢红色那个问题上用户选择了取消，那么再一个confirm是“你是否 喜欢黄色.果百户点击确定，那么弹出“你喜欢黄色不喜欢红色如果用户点击取消，那么弹出“红色和黄色你都不喜欢4 .提示框经常用于提示用户在进入页面前输入某个值。当提示框出现后，用户需要输入某 个值，然后点击确认或取消按钮才能继续操纵。如果用户点击确认，那么返回值为输入的值。 如果用户点击取消，那么返回值为nullo也就是如果点击取消那么没有任何反响。语法：prompt (“文本“，“默认值”)这里的文本是这个对话框上方弹出的提示语。这里的默认值是对话框刚翻开的时候默认出现 在对话框里的内容。创立页面，要求实现功能：title改成你自己的名字。最终效果为：当用户输入自己名字后，页面提示为“XX,成功学院欢迎你的到来！ xx是 用户自己输入的名字。5 .创立页面，包括一个文本框一个按钮，使其最终效果为：当用户输入自己性别后，如果 输入为“男，那么页面显示“先生你好，如果输入为“女，那么显示“女士你好”。6 .页面翻开之后，会直接出现提示框，第一个提示框是请用户输入自己的姓名，第二个提 示框是请用户输入性别为“男或者“女。根据用户输入的信息，页面显示“XX先生你 好或者“XX女士你好。这里的xx是用户在第一个prompt提示框中自己输入的名字。实验九d i v与text的显示应用练习实验目的l.nerHTML的灵活应用2.v与text的显示应用3.1ue与innerHTML的区别于练习实验内容1 .此题目是练习课本P36的4.2的内容，通过id访问元素，并通过innerHTML属性改变其 内容。题目要求为，用户在文本框中输入自己的名字，单击按钮，那么页面的div中出现一 句话“XX,你今天心情好么 XX是用户在文本框中输入的名字。文本框中默认值为你自己的 姓名。这个题目比较容易，我再强调一下里面涉及的知识点：div要显示内容应该把div对应id 的innerHTML属性设置为你需要显示的内容即可。比方document.getElementById("注意这 里要输入div的id").innerHTML="你的名字”而文本框的值那么由这句经典代码来指代。document.getElementByld("文本框的 id").value他们的一样点是都要用到document.getElementByld,都要在括号内的引号中输入id。区别是 div后面跟的是innerHTML,而text文本框后面跟的是valueo2 .此题目要求为，设计页面代码，在页面内增加一个文本框，文本框内默认值为10。当用 户单击第一个按钮的时候，那么文本框中依次出现10,20,40, 80 就是前一个数的倍数。而单击第二个按钮，那么刷新页面，重置文本框的值。这个题目比较容易，我再强调一下里面涉及的知识点：div要显示内容应该把div对应 id 的innerHTML 属性设置为你需要显示的内容即可。比方 document. getElementByld ("注意这里要输入 div 的 id" ) . innrHTML="你的名字” 3 .Math .random ()是一个从0到1的随机数。那么如果我想得到从0至U 10的随机数呢那 么就需要我们让Math. random ()*10就可以了。然后通过四舍五入，就能得到一个从0 到10的随机整数。任务9的要求是创立一个页面，页面内有一个按钮和一个文本框。单击按钮的时候文本框 中随机出现一个0到10随机数。建议从我的示范页面中选择和复制代码来完成。4 .请把以下代码复制到空文档中，用浏览器翻开，然后按要求修改代码实现功能。 <html> <head>文本框赋初值和单击清空。</title><script> function a() document.getElementByld(ntl") .value=Math.round(Math.random()* 99 + 1 )； ) function b () document.getElementByld(ntl") .value=n n;) function c () ) function d() )</script></head> <body>本页面的A, B按钮已经具备了相应功能。请学习其代码，然后对C,D按钮输入js代码， 使其实现页面上要求的功能。</br></br></br>input typxt" id=ntl" valu=”这里会出现一个随机数"</br>现在是 <input type=ntext" id=nt2n value=n10n> 时 <input type=ntextn id=nt3n value="ll”>分input type=ntextn id=nt4n value=n12n> 秒<p><input type=nbuttonn value="按钮 An onclick=na () n>单击此按钮，那么上面第一个文本框中会出现一个随机数</p><p><input type=nbuttonn value="按钮 Bn onclick=nb ()">单击此按钮，会清空第一个文本框中的数值</p<p><input type=,TbuttonH"按钮 C” onclick=nc ()">单击此按钮，那么上面的第二，三，四个文本框会出现随机数。<br>这里特别提醒一下，第二个文本框是出小时，那么应该是从0到23的随机数，而文本框三, 四是分和秒，它应该是从0到59的随机数。</p><p><input type=nbuttonn valua="按钮 Dn onclick=nd () n>单击此按钮，那么上面的第二，三，四个文本框中的随机数会被清空。</p></body></html>实验十Javascript程序修改练习实验目的1 .javascript代码阅读能力2 .根据源代码进展改进的能力。实验内容.请把以下代码复制到空文档中，用浏览器翻开，然后按要求修改代码实现功能。<html><head>title郭峰<script>function a()function b()</script></head><body>在此页面根基上进展代码修改，使得下面的A,B按钮可以完成相应的运算功能。</br></brx/br><input type二"text" id="tl”+<input type="text” id=”t2"二<input type二"text” id二“t3"></br><input type="text“ id="t4”> -<input type="text" id="t5n>=<input type="textH id=nt6H></br><input type="text” id=nt7n>x<input type="text" id=<input type=ntext,' id=nt9n></br><input type二"text”<input type二"text" id=ntl 1 n>=<input type=ntextn id=',tl2H></br><pxinput type="button” value="按钮 A" onclick=na(),>单击此按钮，那么上面四个式子的等号左侧文本框中会随机出现。到100之间的整数v/p<pxinput type二"button” value二”按钮 B" onclick二“b()”单击此按钮，那么上面四个式子的等号左侧文本框中会随机出现。到100之间的整数，并且 最右边的文本框中会出现他们的计算结果。</p></body></html>.请把以下代码复制到空文档中，用浏览器翻开，然后按要求修改代码实现功能。<html><head><t it 1郭峰/title<script>function a () </script></head><body><p>请在此输入您的姓名：input type=ntextn id=ntl" valu，="张三”</p><p><input type=nbuttonn va1u;="测试您的幸运数！ " onClick="a ()"> </p><p要求单击此按钮后，下面文本框中出现一句话：&ldqu。；恭喜xxx!我们已经测试出您 的幸运数字为y”。xxx为上面文本框中输入的名字，y是一个从0到100的随机 整数。</p><P>input type=ntextn id=nt2n size=n50n></br></p></body></html>实验HJavascript中的函数应用练习实验目的1 .讲解了第四章的三个 基本函数confirm。,prompt。,location.reload。而重点那么是这 之后的数学函数Math.random。这个函数可以随机产生一个从。到1之间的随机数。把 它与ceil, floor, round这三个取整函数相组合，就能产生很多不同的效果。这也将是我 们下周的主要练习内容。2 .知识Math.round(),Math.random()o而我们最常见的形式是把他们组合在一起使用，如： Math.round(Math.random()*x)x的值是几，它就会出现一个从。到几的随机整数。3 .直接用id来引用页面内对象的方法。实验内容1.请把以下代码复制到空文档中，用浏览器翻开，然后按要求修改代码实现功能。<!DOCTYPE html PUBLIC ”-W3C/DTD XHTML 1.0 Transitional/ENn ”:/w3.org/TR/xhtml 1/DTD/xhtml 1 -transitional.dtdn><html xmlns=" ：/w3.org/1999/xhtmln><head><meta -equiv=nContent-Typen con ten n text/html; charset=utf-8n /><style type=ntext/cssn> v!-body background-color: #006699;)#dl background-color: #FFFFFF;height: 200px;width: 400px;margin:0 auto;)></style></head><body><div align=McenterH id=,dl',><div align="center"><p align二网页的背景颜色往往是一组六位的十六进制数。比方#990000代表红 色。</p>vpalign二此题要求是：更改“随机色按钮的代码，使其每次单击时候，网页背景都随机呈现一个新的颜色。</p>vpalign=思路：每次单击该按钮，都生成一个随机的六位整数，并将这个数作为 网页的背景颜色代码即可。</p><p><br /><inputtype=" button”value=n红onclick=Hdocument.body.style.backgroundColor='#990000"7><inputtype=,'buttonnvalue="绿onclick=ndocument.body.style.backgroundColor='#009900M7><inputtype="button”value=”蓝onclick=Hdocument.body.style.backgroundColor=,#000099n7><inputtype二" button"value=M 随 机onclick=n=,#999999n7></p></div> </div></body></html>.请设计页面代码，要求实现功能为：使得当单击按钮”文本框内出现随机整数”时，文本 框内出现十以内随机整数。单击生成随机数按钮，会生成一个10以内的随机整数，并 通过alert让它显示出来。生成一个10以内的随机整数的代码是 Math round（Math.random（）*10）单击”文本框内出现10”，方法是设置tl的value为10、这样写是因为文本框的id是 tl.请设计代码，要求效果为，单击按钮后，文本框2会出现文本框1的值与40相加的 结果。比方文本框1内是20,那么文本框2内应该是20 + 40 = 60.<特别提醒，要让两个数相加，必须通过parselnt）（）把它变成数值型。比方一个x是字符型，那么pars工nt （x就是它的数值型。注意所有标点符号都必须是英文形式的。实验十二数字计算程序设计练习实验目的.通过上机实验调试代码，掌握与数学计算有的程序设计技巧实验内容.请设计代码实现P47第2,3行的设计任务。圆柱体的体积公式：底面积*高度二冗*半径的平方*高度所以我们这个页面应该有三个文本框，第一个让用户输入半径，第二个让用户输入高度， 用户单击按钮之后，第三个文本框显示圆柱体的体积。要点就是先得到前两个文本框的值，然后将其转为数值型相乘，并乘以Math.PL （Math.PI 是javascript中的数学函数，代指圆周率。）然后将结果显示在第三个文本框中。1 .请设计代码，要求效果为，单击按钮后，文本框2会出现文本框1的值与40相加的结 果。比方文本框1内是20,那么文本框2内应该是20 + 40 = 60.特别提醒，要让两个数相加，必须通过parselnt）（）把它变成数值型。比方一个x 是字符型，那么parse工nt （x）就是它的数值型。注意所有标点符号都必须是英文形式的。2 .请设计页面代码，要求实现功能为：增加代码，使得用户在文本框中输入一个数字，然 后单击按钮”文本框2内出现随机整数”时，文本框内出现一个不大于第一个文本框中数字 的随机整数。也就是说，文本框1中的那个数字，就是文本框2中的数字的变化范围，或 者最大可能值。3 .请设计页面代码，要求：使得数组shuzu3在前两个元素之后多一个元素“元素3， 并且单击按钮的时候，让元素3显示在alrt中。4 .请设计代码，单击按钮之后，在tl文本框中显示这个数组的第4个元素的值。注意，第 一个元素的序号是0,所以第四个元素的序号应该是3.5 .请设计代码，使得页面单击按钮时，创立一个7元素数组，每个数组元素是一个颜色的 名字，然后单击按钮，那么文本框内随机出现一个颜色的名字。实验十三数组程序设计练习实验目的,掌握数组的创立于赋值等基本功能的用法。1 .掌握数组在js中灵活运用的普遍思路。头验内谷L请设计代码，使得页面单击按钮时，创立一个8元素数组，每个数组元素是一个城市的名 字，然后单击按钮，那么文本框内随机出现一句话：“你最适合的旅游城市是*。这个城 市的名字是随机的。2 .此题要求效果为，用户在第一个文本框输入姓氏，然后单击按钮，那么第二个文本框会 随机出现一*个见孩的名字。此题目已经创立了包含N个男孩名字的数组，关键是：我们要在数组中随机选择一个元素, 就要知道数组有几个元素。但是不知道的时候怎么办呢课本54页的5.42提到了一个属性“数组名.1ngth，直译是数组的长度，其实就是 数组元素个数。提示：比方一个数组有10个元素，那么其序号就是从0到9,所以我们就让它的数组序号 为从0到(10-1)的随机数即可。3 .此题目引用了文件夹内的十张旅游图片。请修改代码，使得页面单击按钮时，页面内出 现一张随机的旅游图片。4 .此题目引用了文件夹内的十张旅游图片。请修改代码，使得页面单击按钮时，页面内出 现3张不同的随机旅游图片。此题的思考点在于：怎样实现让它一次抽取三个不同的数组元素此题的扩展知识是：通过设置img的width宽度属性，可以改变图片大小。 width="200Px”是让图片宽度为200像素，高度那么自动同比例改变。5 .请设计代码，使得页面效果为：单击按钮的时候，页面内9个单元格会随机出现不同颜 色。请注意，我已经给九个单元格都写好了 id,是从tl到t9.实验十四Javascript综合应用练习实验目的1解和稳固课本P66的switch构造的知识2.数组，if, switch,逻辑符，显示图片这五个知识点进展综合应用练习。实验内容.设计一个页面，要求完成如下功能页面内有一个div, 一个按钮，用户在文本框内输入名字，单击按钮，那么页面会出现一个 图片，并通过alert显示说明：根据您的信息推算，您的男神是*思路：创立一个数组，数组中有各个男神的姓名。单击按钮，那么从中随机抽取一个男神的 姓名，通过alert显示出来。并且我在div中已经插入了一个空的img图片对象，其id为il, 你让这个img的src值等于这个男神的姓名加jpg即可。比方你想让il出现吴彦祖，那么代 码格式为il.src=吴彦祖.jpg。1 .要求题目效果：用户单击某个单元格，那么该单元格内会出现一个男神图片。题目思路：1 .每个单元格td都要设1个onclick事件，onclick=f (this) o this 指的是该代码所在的网页对象本身。比方这个代码位于一个td单元格中，this指的就是 这个ta单元格。2.function f(x) 的功能是：首先创立男神姓名数组，然后从中随机 抽取一个男神姓名，跟我已经给出的代码相组合，让该男神的图片出现在单元格中。2 .题目效果：用户单击按钮，那么九个单元格中会有八个随机变灰色，仅剩下正中间一个单元格显示一个 男神图片，并且通过alrt显示一句话：“果然xx才是你的真爱啊！如果对结果不满意，单击“重新选择按钮，可以再测一次。题目思路：每个单元格td都有自己的id。这个题目和任务03相比就增加了一个功能，就 是让每个单元格的原有内容消失。同时让正中间的单元格显示一个随机的男神图片即可。3 .请设计本页代码，要求实现功能为：请用户在文本框内输入年龄。如果用户年龄大于20 岁，那么显示“你到了合法结婚年龄了。否那么那么显示“你还没到合法结婚年龄呢。4 .请设计本页代码，要求题目效果：请用户在文本框输入自己年龄，如果用户年龄大于80 岁或者小于10岁，那么显示“别人会在公交车上给你让座否那么那么显示“你应该在公交车上给别人让座此题有两个思路l.parselnt(tl.value)>=80 | parselnt(tl.value)<=10上面这句意思是你的年龄在80以上或者10以下2.parselnt(tl.value)>=10 && parselnt(tl.value)<=80上面这句意思是你的年龄在80以下而且10以上逻辑与&&逻辑或| |在课本P67。请把这个知识点画线。5 .请创立一个网页，实现如下功能：页面内有一个文本框，让用户输入他出生的月份值， 然后单击按钮。如果这个值小于7,那么弹出一句话“你是上半年出生的如果这个值大于 等于7,那么弹出一句话“你是下半年出生的.请设计代码，实现功能为：单击按钮后自动进展判断，如果你的收入是“傲视群雄而 且假期安排为“带薪假期，那么你的假期心情图片il的srcwi.gif屋否那么是0.gif。 提醒：此题必然会用到课本P67的逻辑与操作符。另外这里我插入的是动图，图片扩展名 是gif不是jpg,不要写错了。6 .请设计代码，实现功能为：单击按钮后自动进展判断，如果你得到了好安排，那么你的假 期心情图片il的src=U.gif '否那么是0.gif。至于什么是好的，由你自己决定。但 是至少应该有三个选项符合好心情标准。实验十五选择构造程序设计练习实验目的L熟悉选择程序语言的 基本构造。2 .会定义javascript中的选择构造。3 .熟悉对选择构造的一些基本操作和具体的应用。实验内容.设计代码，使用switch选择构造，使其实现功能为：页面有四个按钮，如果是单击“红 灯“按钮，那么弹出alert “请停车！如果是黄灯，那么弹出alert请观察后通过路口。如 果是绿灯，那么弹出“请直接通行。如果是灯都灭了，那么弹出“信号灯已坏，请慎重观 察，缓速通行。1 .设计页面，要求使用switch选择构造来实现为：请用户在文本框输入年龄，然后单击按钮，弹出对应答案0-16 您是青少年17-32您是青年33-48 您是中年人49-64 您是领导人64以上您是长者2 .设计页面，要求使用switch选择构造来实现为：请用户输入考试成绩，然后单击按钮，弹出对应答案0-59 您明年再来吧6069您可以安心了70-79 您考的还不错80-89 您和学霸只有一步之遥90以上 我以学霸之血宣布，封印解除！100请大神收下我的膝盖吧！3 .请修设计代码，使其实现功能为：页面一开场提问您喜欢什么宠物有三个按钮选项，猫， 狗，兔子。选择单击按钮狗，那么页面提示：狗是非常聪明的动物，但是每天遛狗需要您付 出相当多的时间，精力乃至毅力。选择猫，那么页面提示，猫很适合与人共处，优点是易于打理且不像狗那样需要陪伴，相应 的，猫咪很多时候不是特别粘人。让养育者很难有主人的感觉。选择兔子，那么提示：兔子大多数时候可以表现的比猫还萌，但那时因为它真的呆蠢，确实 傻到不要不要的。大多数时候只会凭本能行事。4 .请自己创立一个网页实现如下功能：网页内有一个文本框，请用户输入自己的笔记本电脑的价格之后单击按钮默认价格必然在 1000之上)，那么页面内显示一句话：如果用户输入的数值是2000以内，那么显示这是低端入门款如果用户输入数值大于等于2000而小于3000,那么显示你这是影音视觉系笔记本电脑 如果用户输入数值大于等于3000而小于4000,那么显示你这是在宿舍打游戏一般都能带动 的节奏啊如果用户输入数值大于等于4000而小于5000,那么显示土豪你打游戏是不是有飞一般的感 觉如果用户输入数值大于5000,那么显示这位朋友我们处在不同的世界还是分手吧！5 .此题目是上一题的附加题。上一题给笔记本电脑根据价格写评语，有个问题，如果用户真 的输入了不合理的数值，比方1000以下，我们应该怎么办呢一个合理的程序设计应该考虑到各种情况，并且给顾客以相应的反响，帮助用户得到正确的 答案。请修改你刚刚的任务的答案，使得当用户输入低于1000或者高于20000的数字时，提示用 户：您输入的价格已经超出了常标准围，想必是您不小心输入了错误的数据，请重新输入。 同时将用户已经输入的数字清零。清零这一步，因为用户是在一个文本框中输入的内容，那么我们有两个方法。你可以执行 location.reload(),刷新当前页面，那么用户输入的数据自然会清零；你也可以强制让那个文 本框的值清零，假设那个文本框的id叫tl,那么你可以设置tl.valued或者tl.value="”都可 以。实验十六Javascript控件综合应用练习实验目的.掌握button, div, text等控件的 基本代码。1 .练习灵活运用以上控件来实现页面功能的方法。实验内容L图片本身也可以设置onclick事件来切换图片内容。请在页面内插入图片01,设其src=0l.jpg。然后设置onclick事件来调用function f要求实现效果为，用户单击图片的时候，让它在01与02.jpg之间切换也就是单击的时候，function会判断，如果现在是01,那就让它的src=02.jpg。如果现在的 图片不是01,那就让图片的src=01.jpg.要求实现效果为：当用户输入身高体重并单击按钮之后，页面不是alert显示答案，而是把提示语直接显示在 页面上，并且同时搭配一张图片。过轻，过重，正常，肥胖，非常肥胖对应的gif我会同时 发送到文件夹内。请对号入座。3.：创立一个页面，包括3个按钮，单击第一个按钮alrt弹出你的名字，单击第二个按 钮alert弹出你的家乡，单击第三个按钮alert弹出你的辅导员的名字。4：创立一个页面，包括3个按钮，单击第一个按钮alrt弹出你的名字，单击第二个按 钮alert弹出你的家乡，单击第三个按钮alert弹出你的辅导员的名字。和任务3的区 别是这个必须使用参数传递方式来完成，也就是这个页面只能有一个function。5：创立一个页面，包括3个button和一个div。要求单击第一个按钮，div中显示你的 姓名；单击第二个按钮，div中显示图片阿狸gif；单击第三个按钮时div里出现一个标 题为“郭峰的按钮。6：创立一个页面，包括两个文本框和一个按钮。要求用户在第一个文本框输入自己的幸运 数字。单击按钮时第二个文本框中出现一句“您的幸运数字是。x是用户刚刚输入的幸 运数字的值。7：创立一个页面，包括2个文本框和一个按钮。要求用户在第一个文本框输入自己的幸运 数字。单击按钮时第二个文本框中出现一句“您的幸运数字的平方是x。x是用户刚刚输 入的幸运数字的值的平方。8：创立一个页面，包括2个文本框和一个按钮。要求用户在第一个文本框输入自己的幸运 数字。单击按钮时第二个文本框中出现一句“您的幸运数字与10相加的结果是x。这个 题目因为涉及加法所以必须使用pars工nt ()函数。实验十七循环构造程序设计练习实验目的.熟悉javascript中的循环 基本构造。1 ,会定义循环构造的各个参数。2 .熟悉循环构造的常见用法。头验内谷.创立一个页面，包括1个按钮，一个div, 一个txt。请用户在txt中输入自己的出 生年份，然后单击按钮。如果年份小于等于1995,那么div中显示一句“你已经到了法定 结婚年龄了，否那么显示“你还不能结婚呢。1 .创立一个页面，包括2个按钮，一个div, 1个txt。请用户在txt中输入自己的出 生年份，然后单击对应的按钮。两个按钮分别显示“男，“女。我国法律是男22周岁 女20周岁允许结婚。也就是如果用户单击“男按钮，那么他的出生年份如果年份小于等于1993,那么div中 显示一句“你已经到了法定结婚年龄了，否那么显示“你还不能结婚呢。也就是如果用户单击“女按钮，那么他的出生年份如果年份小于等于1995,那么div中 显示一句“你已经到了法定结婚年龄了，否那么显示“你还不能结婚呢。2 .创立一个页面，包括1个button。要求单击第一个按钮，那么按钮标题显示为“您的幸 运数字是x”。x是一个从1到9之间的随机整数。此题用到两个知识点，一是 Math. round (Math. random () *x)随机整数,二是 button 的 value 值显示它的标题。3 .创立一个页面，包括1个div和一个按钮。要求用户单击按钮时div中出现一句“您的 幸运宠物是x。x是数组中生成的一个随机的宠物类型。此题目考察数组。要求用户先创 立如下数组，然后单击按钮那么出现数组中的一个随机值。var shuzu=“猫“，”狗“兔子“，“仓鼠“，“狐狸" J乌龟I，金鱼I，松鼠I，猴子I， 变色龙1 , T蜗牛I，雪貂I，龙猫I，鹦鹉,.创立一个页面，包括2个按钮和一个img。两个按钮的标题分别是“方片K，“黑桃Q。 页面img一开场显示文件夹中的图片l.jpg。用户单击按钮的时候那么图片变化为按钮标 题对应的图片。4 .创立一个页面，包括1个按钮和一个img。要求用户单击按钮时img图片显示为img文 件夹中的九个gif图片中的随机一个。思路是创立一个九元素的数组，元素名为img文件 夹中的图片名。然后单击按钮的时候img的src为这个数组中的随机一个图片。记得一定 要加上路径“ img/"。“暴怒“，“得意“，“辞别“，“害羞”，“加油”，“恐惧快乐“，“满足“，“撒娇”.设计页面，要求页面内循环出现6个65 .设计页面，要求页面内出现6到66.设计页面，要求页面内出现4行4列的一共16个6.6 .设计页面，要求页面内出现6行16列的一共96个6.设计页面，要求页面内出现完整版99乘法表7 .设计页面，要求页面内出现只有左下角局部的常规型99加法表.设计一个页面，完成功能为页面显示一个五行星阵，形式如下：* *火*火* * * *实验十八for构造程序设计练习实验目的.熟悉for循环 基本构造。1 .会定义for构造的主要参数。2 .能灵活应用for构造解决实际问题。实验内容本组题目要求全部使用for循环构造来实现。1 .设计页面，要求页面内循环出现8个8.设计页面，要求页面内出现8到882 .设计页面，要求页面内出现8行8列的一共64个8.3 .设计页面，要求页面内出现16行20列的一共320个8.设计页面，要求页面内出现完整版99乘法表4 .设计页面，要求页面内出现只有左下角局部的常规型99加法表7,设计一个页面，完成功能为页面显示一个五行星阵，形式如下：卡* * * *8 .思考题：完成功能为页面显示如下星阵大*火 * * * *9 .思考题：完成功能为页面显示如下星阵* * *大*大*大火 大 *10 .思考题：完成功能为页面显示如下星阵代码编写环境：可根据机房主机条件自己决定。推荐notepad, Dreamweaver, eclipse, hbuilder 等。页面预览环境：建议学生及早考虑和适应跨浏览器自适应问题。推荐Firefox, google chrome,世界之窗，Internet Explorer 等。实验一Javascr i pt基本页面操作实验目的LJS页面基本构造。2 .JS中变量 基本格式。3 .变量与字符串相连接并显示结果。4,使用按钮与function 对应来实现代码功能。实验内容.在C盘下创立文件夹1.1。在文件夹内创立一个txt文档，并命名为。xx是你学 号后两位。然后把课本P10的程序1.1输入该文档，并把内容改为你自己的名字。<alert> 内容改为你的名字加欢迎标语。<alert>后面是P9的最后一行，但是把” ”里面的内容换成你 自己的名字。保存该文档，并用google浏览器查看效果。1 .请将课本P10倒数第四行代码中的alert换成document.write并保存。你可以把任务01答 案.html中的代码直接进展修改。然后用google浏览器翻开这个页面看效果。想想alert和 write的功能各是什么。2 .请看课本P12的1.11练习，将任务01的页面代码的script中增加 alert (document. title) o保存后用google浏览器翻开看效果。3 .我们一般建议在body中完成页面的布局设计，而将script代码放在head中。我
