jQuery第五次实验报告

《jQuery第五次实验报告》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、电子科技大学成都学院云计算系标准实验报告（实验）课程名称jQuery电子科技大学成都学院云计算系电子科技大学成都学院实验报告学生姓名：王建尧学号：1641310911指导教师：康晓慧实验地点：二教实验时间：15-16一、实验室名称：云计算系计算机实验室二、实验项目名称：jQuery+html+css实现打地鼠游戏三、实验学时：6四、实验原理：jQuery技术，html5技术，css3技术五、实验目的：（1）掌握jQuery选择器，过滤器，常用方法，常用动画（2）掌握divulli布局；六、实验结果和代码展示请分步骤描述你完成本次实验的过程1.首页界面：点击开始出

2、现num行num列的表格，请写出实现该功能的jQuery代码、html代码、css代码，并截图展示。$("#mainulli").detach();varnum=$("#num").val();for(i=0;i");}varw=Math.floor($("#mainul").width()/num)-2;$("#mainulli").width(w);$("#mainulli").height(w);Body行数：

3、"1"value="2"id="num"/>1.出现图片：页面上循环地出现和消息图片（地鼠和兔子），请写出实现该功能的jQuery代码、html代码和css代码，并截图展示。$("#mainulli").empty();varnum=$("#num").val();varhh=Math.floor(Math.random()*num*num);varbb=Math.floor(Math.random()*num*num);$("#mainulli").eq(hh).html("");while(h

4、h==bb){bb=Math.floor(Math.random()*num*num);}$("#mainulli").eq(bb).html("");jiange=parseInt($("#speed").val());$(".dishu").fadeOut(jiange,function(){if($(this).attr('flag')!=1){score-=1;$("#integration").html(score);}});$(".tuzi").fadeOut(jiange,functio

5、n(){if($(this).attr('flag')!=1){score-=1;$("#integration").html(score);}});1.打击地鼠和兔子：页面上出现榔头，打击地鼠时实现更换图片，请写出实现该功能的jQuery代码、html代码和css代码，并截图展示。$("body").on('click','.di',function(){goal+=1;$(this).attr('sum',true);$("#goal").html(goal);$(this).parent().html(""

6、)})$("body").on('click','.tu',function(){goal+=1;$(this).attr('sum',true);$("#goal").html(goal);$(this).parent().html("")})}游戏速度：1.计分：请写出实现该功能的jQuery代码、html代码和css代码，并截图展示。$("body").on('click','.dishu',function(){score+

7、=1;$(this).attr('flag',1);$("#integration").html(score);$(this).closest("li").html("");$(".dadishu").fadeOut(1000);#mainul{width:100%;height:100%;border:1pxsolidblue;}#mainulli{list-style:none;float:left;border:1pxsolidblue;}div{cursor:url(file:///

8、E

9、/Notepad++