Question

我创建了一个小游戏，我创建了一个正方形表，第一个点击左下角的游戏就失败了。

我在程序中编辑左下角[point：（1,1）]方格有问题。我的目标是有一个绿色的方块，在我的.CSS中标记为#poison

    #poison {
   width: 5em;
   height: 5em;
   padding: 0;
   background-size: 5em 5em;
   background-image: url("http://imgur.com/6Apk8Rk");
   }

而不是我目前输出的常规棕色方块。

我不确定如何用#poison square替换左下方。

这是我用来创建表的JS函数。

function makeTable(x, y) {
    var gameTable = document.getElementById('gameTable'),
    poison = document.getElementById('poison');

    gameTable.innerHTML = null;
    var table = [];
    //creates rows
    for (let i = 0; i < x; i += 1) {
        var row = document.createElement('tr');
       //appends each row to the table
       gameTable.appendChild(row);
       //store the amount of iterations in array trow
       var tRow = [];
        table[i] = tRow;
        //create columns (cells)
        for (let j = 0; j < y; j += 1) {
            let cell = document.createElement('td'); //td defines a cell
            //set x,y coordinates
            cell.pos = { x: i, y: j };
            //stores table values into cell
            table[i][j] = cell;

           //if you click the bottom left piece of chocolate..
           if (i === x - 1 && j === 0) {
              cell.onclick = function() {
              //..restart the game
              restartGame(); 
              }
             //else, behave normally
            } else {
            cell.onclick = function() {
            cellClick(cell); 
            }
            }
            //append cells to the table
            row.appendChild(cell);
        }
    }
}

以下是按要求提供的相关HTML：

    <fieldset id="RowColbox">

 <label>
   <span>Rows:</span>
   <input name="Cols" id="cols" type="number" value="3"/>
 </label>

   <label>
   <span>Columns:</span>
   <input name="Rows" id="rows" type="number" value="4"/>
   </label>



   <button id="addDimensions" type="button">create</button>
</fieldset>


<table id="gameTable"> 

</table>

Here是我的完整代码。

Answer 1

假设您的代码尚未完成，您可以通过以下方式分配ID＆＃34; poison＆＃34;到特定的单元格（例如：{x:1, y:1}）：

//set x,y coordinates
cell.pos = { x: i, y: j };
if(cell.pos.x === 1 && cell.pos.y === 1){
    cell.id = "poison";
}

Answer 2

这是一种向左下栏添加“毒药”的方法

if(cell.pos.x === (x-1) && cell.pos.y === 0){
    cell.id = "poison";
}

选择表格中的最后一个元素

2 个答案: