Minijuego JS Snake + comentarios detallados

Consejos: (老鸟跳过，希望对新手有所帮助)

1. IE: element.innerText = FF: element.textContent；
2. setAttribute("cellpadding","0")在IE中无效，正确写法cellPadding (一不小心就)
3. "
4. IE: crear elemento de tabla, 记得加tbody
5. ；

代码（有详细注释）：

// código de CNwander.
// común
función $(cadena) {
devolver document.getElementById(str);
}
función $etiqueta(cadena,objetivo) {
objetivo = objetivo || documento;
devolver target.getElementsByTagName(str);
}
// global
// constante
var ANCHO = 20, //网格宽度
ALTURA = 20, //网格高度
SAY = ["相当不错，虽然说和CNwander还不是一个级别的","可以啊，再加点油都可以和CNwander媲美了！","一个字，牛，连CNwander都甘拜下风了","差不多行了，别把游戏玩爆了"];
var len = 3, //蛇的长度
velocidad, //爬行速度
gridElems = multiArray(ANCHO,ALTO), //单元格对象
transportista, //承载对象(食物，障碍，滑板，刹车)
serpiente, //蛇每节的坐标点
información, //交互对话
btnStart, //开始按钮
puntuación superior = len,
SnakeTimer, //蛇行走计时器
BrakeTimers = [], //随机刹车
skateTimers = [], //随机滑板
clave directa; // 方向键值 37-40 左上右下
ventana.onload = función(){
información = $("decir");
btnInicio = $("btnInicio");
initGrid(); //网格初始化
document.onkeydown = adjuntarEventos; //绑定方向事件
btnStart.onclick = función (e) {
btnStart.blur(); //firefox中必须释放焦点
comenzar(); //游戏开始
btnStart.setAttribute ("deshabilitado", verdadero);
btnStart.style.color = "#aaa";
}
}
//开始游戏
inicio de función() {
longitud = 3;
velocidad = 10;
clave directa = 39;
transportista = multiArray(ANCHO,ALTO);
serpiente = nueva matriz();
claro();
initSerpiente(); //蛇初始化
addObject("comida");
caminar();
agregarFrenoAleatorio();
}
//创建网格
función initGrid() {
var cuerpo = $etiqueta("cuerpo")[0];
var tabla = document.createElement("tabla"),
tbody = documento.createElement("tbody")
for(var j = 0; j < ALTURA; j++) {
var col = document.createElement("tr");
for(var i = 0; i < ANCHO; i++) {
var fila = document.createElement("td");
gridElems[i][j] = col.appendChild(fila);
}
tbody.appendChild(col);
}
tabla.appendChild(tbody);
$("snakeWrap").appendChild(tabla);
}
//创建蛇
función initSerpiente() {
puntero var = puntero aleatorio (len-1, len-1, ANCHO/2);
para(var i = 0; i < len; i++) {
var x = puntero[0] - i,
y = puntero[1];
serpiente.push([x,y]);
transportista[x][y] = "cubierta";
}
}
//添加键盘事件
función adjuntarEventos(e) {
mi = mi || evento;
clave directa = Math.abs(e.keyCode - directkey) != 2 && e.keyCode > 36 && e.keyCode < 41 ? e.keyCode: clave directa; //非方向键、反向无效
devolver falso;
}
función caminar() {
if(snakeTimer) ventana.clearInterval(snakeTimer);
SnakeTimer = window.setInterval(paso, Math.floor(3000/velocidad));
}
paso de función() {
//获取目标点
var cabezaX = serpiente[0][0],
cabezaY = serpiente[0][1];
cambiar (tecla directa) {
caso 37: cabezaX -= 1; romper;
caso 38: cabezaY -= 1; romper;
caso 39: cabezaX += 1; romper
caso 40: cabezaY += 1; romper;
}
//碰到边界，阻挡物，则结束游戏
if(headX >= ANCHO || headX < 0 || headY >= ALTURA || headY < 0 || transportista[headX][headY] == "bloque" || transportista[headX][headY] == "cubierta" ) {
trace("JUEGO TERMINADO");
if(getText($("puntuación"))*1 < len) trace(len,$("puntuación"));
btnStart.removeAttribute("deshabilitado");
btnStart.style.color = "#000";
ventana.clearInterval(snakeTimer);
for(var i = 0; i < BrakeTimers.length; i++) window.clearTimeout(brakeTimers[i]);
for(var i = 0; i < skateTimers.length; i++) window.clearTimeout(skateTimers[i]);
devolver;
}
//加速
if(len % 4 == 0 && velocidad < 60 && transportista[headX][headY] == "comida") {
velocidad += 5;
caminar();
trace("加速！");
}
//捡到刹车
if(portador[headX][headY] == "freno") {
velocidad = 5;
caminar();
trace("恭喜！捡到刹车一个。");
}
//遭遇滑板
if(portador[headX][headY] == "patinar") {
velocidad += 20;
caminar();
rastro("遭遇滑板！");
}
//添加阻挡物
if(len % 6 == 0 && len < 60 && transportista[headX][headY] == "comida") {
addObject("bloque");
}
//对话
si(len <= 40 && len % 10 == 0) {
var alegría = DECIR[len/10-1];
rastro(animar);
}
//吃东西
if(transportista[headX][headY] != "comida") {
var lastX = serpiente[snake.length-1][0],
últimoY = serpiente[serpiente.longitud-1][1];
transportista[últimoX][últimoY] = falso;
gridElems[lastX][lastY].className = "";
serpiente.pop();
} demás {
transportista[cabezaX][cabezaY] = falso;
trace("吃到食物");
addObject("comida");
}
serpiente.unshift([cabezaX,cabezaY]);
transportista[headX][headY] = "cubierta";
gridElems[headX][headY].className = "cubierta";

len = serpiente.longitud;
}
//添加物品
función agregarObjeto(nombre) {
var p = puntero aleatorio();
operador[p[0]][p[1]] = nombre;
gridElems[p[0]][p[1]].className = nombre;
}
//添加随机数量刹车和滑板
función agregarFrenoAleatorio() {
var num = número aleatorio(1,5);
para(var i = 0; i < número; i++) {
BrakeTimers.push( window.setTimeout(function(){addObject("brake")},randowNum(10000,100000)) );
skateTimers.push( window.setTimeout(function(){addObject("skate")},randowNum(5000,100000)) );
}
}
//输出信息
función traza(algo,quién) {
quien = quien || información;
if(document.all) quién.innerText = algo;
más quién.textContent = algo;
}
//获取信息
función getText(destino) {
if(document.all) devuelve target.innerText;
de lo contrario, devuelve target.textContent;
}
//创建二维数组
función multiArray(m,n) {
var arr = nueva matriz (n);
para(var i=0; i<m; i++)
arr[i] = nueva matriz(m);
volver llegar;
}
//清除画面
función borrar() {
for(var y = 0; y < gridElems.length; y++) {
for(var x = 0; x < gridElems[y].length; x++) {
gridElems[x][y].className = "";
}
}
}
//产生指定范围随机点
función puntero aleatorio (inicioX, inicioY, finalX, finalY) {
inicioX = inicioX || 0;
inicioY = inicioY || 0;
finX = finX || ANCHO;
finY = finY || ALTURA;
var p = [],
x = Math.floor(Math.random()*(endX - startX)) + startX,
y = Math.floor(Math.random()*(finY - inicioY)) + inicioY;
if(portador[x][y]) devuelve randomPointer(startX,startY,endX,endY);
p[0] = x;
p[1] = y;
devolver p;
}
//产生随机整数
function número aleatorio(inicio,fin) {
return Math.floor(Math.random()*(fin - inicio)) + inicio;
}