龟兔赛跑小游戏前端JS代码练习

var timerObj = -1;
var i = 0;
function start(){
	if(timerObj!=-1)
		clearInterval(timerObj);//如果点了好几次开始，必须清空之前的timerObj = setInterval(move,100)
		
	r = document.getElementById('r')
    w = document.getElementById('w')
    e = document.getElementById('result')
	r.style.left = '200px';
	r.style.top = '200px';
	w.style.left = '200px';
	w.style.top = '300px';
	
	e.style.display = 'none';
	r.style.display = 'block';
	w.style.display = 'block';
	
	timerObj = setInterval(move,100)//每0.1秒调用一次move函数
}

function move(){
	r = document.getElementById('r')
	w = document.getElementById('w')
	e = document.getElementById('result')
	rleft = r.style.left
	wleft = w.style.left
	
	rleft = Number.parseInt(rleft.split('px')[0])//将200px；变成200的数字，进行加减
	wleft = Number.parseInt(wleft.split('px')[0])
	
	rleft += 10;
	wleft += 5;
	
	r.style.left = rleft + 'px';
	w.style.left = wleft + 'px';
	
	array1 = ['img/兔子2.jpg','img/兔子3.jpg']
	if(i<array1.length){
		r.src = array1[i]
			i++
	}else{
		i = 0
		r.src = 'img/兔子.jpg';
	}
	array2 = ['img/乌龟2.jpg','img/乌龟3.jpg']
	if(i<array2.length){
		w.src = array2[i]
			i++
	}else{
		i = 0
		w.src = 'img/乌龟.jpg';
	}
	
	
	if (r.style.left >= '828px'){
		clearInterval(timerObj);
		timerObj = -1;
		e.style.display = 'block';
	}
}