今天是完成打老鼠小游戏，先用表格做25个单元格，每个单元格放背景图，再给body整体放一张大的背景图，随机数组让老鼠随机在25个单元格里冒出，js写方法，隔1秒换一张图片，难点在一秒打老鼠，点击按钮触发换图片。插入了背景音乐。待实现功能是:由玩家决定游戏时常和算分数
js代码
// var imgs;变成全局的，多个方法使用它
var imgs;
var gameTime=20; //20秒后游戏结束；游戏时间
var chImg;
var cutTime;
var mouseBk;
var count=0;//打中地鼠个数
// 开始游戏方法
function start(){
gameTime=20;
changeImg()
// 定时器，一s换一次图片 setInterval(code,millisec) 每隔多少毫秒调用一次
chImg = window.setInterval("changeImg()", 1000);
cutTime = window.setInterval("counterTime()", 1000);
}
function changeImg(){
// 获得所有的img对象 // getElementsByTagName()所有标签根据标签属性获取多个对象
imgs =document.getElementsByTagName("img")
// Math.random()*随机数,0~1的随机数 imgs.length0~24 共25张图片 Math.floor向下取整
var index= Math.floor(Math.random()*imgs.length);// 取0-24的随机值
var img = imgs[index]; //获得数组中的随机img对象
img.src="img/01.jpg";
//1s后，被切换的资源还原 setTimeout(code,millisec) 多少毫秒后调用一次 "+index+"作为一个变量传进去
mouseBk = window.setTimeout("mouseBack("+index+")", 1300);
}
//让随机出现的地鼠资源还原为初始状态 index图片数组的索引
function mouseBack(index){
var img = imgs[index]; //获得数组中的随机img对象
img.src="img/00.jpg";
}
// img要传进来，不然报错找不到图片
function hit(img){
var name=img.src;
// name.length-6 得到00.jpg
var subName=name.substring(name.length-6);
// 当出来的图片是钻出来的小老鼠，换成被打的老鼠
if(subName=="01.jpg") {
img.src="img/02.jpg";
count++;
}
}
function counterTime() {
gameTime--;
//更新游戏剩余时间
var game = document.getElementById("gameTime2");
game.innerHTML = gameTime;
if(gameTime==0) //游戏结束
gameOver();
}
// 游戏结束
function gameOver() {
//停掉计时器
window.clearInterval(chImg);
window.clearInterval(cutTime);
window.clearInterval(mouseBk);
alert("游戏结束，count="+count+"！")
//更新游戏剩余时间
var game = document.getElementById("gameTime2");
game.innerHTML = "20";
// 将表格中的所有图片资源重置
for (var i in imgs) {
imgs[i].src="img/00.jpg";
}
}
// function bofang(yinyue)
// {
// var emd = document.getElementById("mp3");
// emd.innerHTML="";
// emd.innerHTML=\'<audio autoplay="autoplay" loop="loop" preload="auto" src="\'+yinyue+\'.mp3"></audio>\';
// //emd.setAttribute(yinye+".MP3");
// }