Javascript 许多元素的ID

我可能有个奇怪的问题，但解决这个问题对我来说非常重要。 我有一个表，表中的行和列数量不稳定，所以我使用+=操作符来创建单元格、行等。现在我需要识别每个单元格，但我不知道在这种情况下如何才能做到这一点

function drawBoard(board) {
var t="";
t="<table border: 2px >";
var x,y;
for(x=0; x<board.length; x++){
   t+="<tr>";
   for(y=0; y<board.length; y++){
       t+="<td class='tablecell' onclick=''>X</td>"
   }
   t+="</tr>";
}
t+="</table>";
}

功能绘图板（board）{
var t=“”；
t=“”；
变量x，y；
对于（x=0；x您可以使用：

const cells = document.getElementsByClassName('tablecell')

或者，您可以收集创建阶段的每个单元格，例如：

const cells = [];

for (let i = 0; i <  board.length){
  for (let j = 0; j < board.length){
    const cell = document.createElement('td');
    cells.push(cell);
  }
}

t += '<tr id="tr-' + x + '">';

const cells=[]；
对于（设i=0；i
通过识别一个单元格，我假设您希望稍后在代码的不同部分引用它们

您可以通过提供行和单元格类和/或ID来实现它

例如，对于行：

const cells = [];

for (let i = 0; i <  board.length){
  for (let j = 0; j < board.length){
    const cell = document.createElement('td');
    cells.push(cell);
  }
}

t += '<tr id="tr-' + x + '">';

t+=''；

牢房

t += '<td class="tablecell tr-' + x + ' col-' + y + '" onclick="" id="td-' + x + '-' + y + '">X</td>'

t+='X'

然后，行可以被
#tr-x
和单元格
#tr-x>td
以及所有特定列d
。col-y

正如Matheus Avellar提到的，如果您想使用
#td-x-y
引用网格上的特定单元格，您可以将每个单元格的id设置为等于您的“y”变量

比如：

function drawBoard(board) {
  var t = "";
  t = "<table border: 2px >";
  var x, y;
  for (x = 0; x < board.length; x++) {
    t += "<tr>";
    for (y = 0; y < board.length; y++) {
      t += `<td id="table-${y}" class='tablecell' onclick=''>X</td>`
    }
    t += "</tr>";
  }
  t += "</table>";
}

功能绘图板（board）{
var t=“”；
t=“”；
变量x，y；
对于（x=0；x

使用一点ES6模板文字，您可以将ID设置为与“Y”变量绑定，因为它是一个递增的数字。
您所说的“需要识别每个单元格”是什么意思？仅使用
y
为它们中的每一个提供id，因为id将使同一列
具有相同的id。不过，您可能需要使用
x
和
y
的组合，仅使用
tr-x
作为id将使同一行
具有相同的id。您可能需要使用
x
和的组合
y
就在2分钟前，我添加了secondary class
col-y
，以防我们要选择特定类型的所有列，但确保添加额外的
id
来创建网格会很有用，谢谢