为棋盘创建坐标的最佳方法

Question

我想为棋子创建坐标。有没有更好的方法来创建它们？

let div = document.getElementById("example");
for (let i = 1; i < 9; i++) {
  const xAxis = ["A", "B", "C", "D", "E", "F", "G", "H"];
  for (let j = 1; j < 9; j++) {
    div.innerHTML += xAxis[i - 1] + "" + j + ",";
  }
}

<div id="example">

</div>

Answer 1

我唯一能想到的就是在你的数组上使用Array.forEach并使用表来强制执行列布局。

CSS 3 n-child for styling？

var table = document.body.appendChild(document.createElement("table"));
["A", "B", "C", "D", "E", "F", "G", "H"]
.forEach(function(letter) {
  var tr = table.appendChild(document.createElement("tr"));
  for (var num = 1; num <= 9; num++) {
    var td = tr.appendChild(document.createElement("td"));
    td.innerHTML = letter + num;
  }
});

tr:nth-child(even) td:nth-child(even) {
  background: red;
}

tr:nth-child(odd) td:nth-child(odd) {
  background: red;
}