为表格单元分配一个id？

Question

我想一个ID添加到细胞中，所以像0行/列0将有1一个id，0行/列1将有2的ID，等

继承人，即时通讯我的代码有工作：

function init() { 

var board = document.getElementById("board"); 
var NUM_ROWS = 6; 
var NUM_COLS = 6; 
for (row = 0; row < NUM_ROWS; row++) { 
    var tr = document.createElement("tr"); 
    for (col = 0; col < NUM_COLS; col++) { 
     var td = document.createElement("td"); 
     var img = document.createElement("img"); 
     img.src = 'images/image0.png'; 
     img.id = 'r' + row + 'c' + col; 
     td.appendChild(img); 
     td.addEventListener("click", function() { 
      var img = this.childNodes[0]; 
      img.src = 'images/image1.png'; 
}); 
    tr.appendChild(td); 
} 
board.appendChild(tr); 

} 

Answer 1

您可以创建和增加一个id变量分配给每个表格单元格有序的数字标识符：

var board = document.getElementById("board"); 
 
var NUM_ROWS = 6; 
 
var NUM_COLS = 6; 
 
var id = 1; 
 
for (row = 0; row < NUM_ROWS; row++) { 
 
    var tr = document.createElement("tr"); 
 
    for (col = 0; col < NUM_COLS; col++) { 
 
    var td = document.createElement("td"); 
 
    td.id = id++; 
 
    var img = document.createElement("img"); 
 
    img.src = 'images/image0.png'; 
 
    img.id = 'r' + row + 'c' + col; 
 
    td.appendChild(img); 
 
    td.addEventListener("click", function() { 
 
     var img = this.childNodes[0]; 
 
     // showPicture(img); 
 
     console.log(img.id); 
 
    }); 
 
    tr.appendChild(td); 
 
    } 
 
    board.appendChild(tr); 
 

 
}

<table id="board"></table>