选择 table 中的最后一个元素

Question

我正在创建一个小游戏，其中我创建了一个 table 个正方形，第一个点击左下角的方块就输了。

我在编辑程序左下角 [point: (1,1)] 方块时遇到问题。我的 objective 是有一个绿色方块，在我的 .CSS

中标记为#poison

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

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

我不确定如何用#poison 方块替换左下角的方块。

这是我用来创建 table.

的 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 "poison" 分配给特定单元格（例如：{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

这是一种将 "poison" 添加到左下栏的方法

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

选择 table 中的最后一个元素

Selecting the last element in a table

html

javascript

css

frontend