javascript - 如何从表格中选择某个单元格

标签 javascript html css

我有 14 个生成的单元格。

如何从14个单元格中选择一个特定的单元格并对其进行控制?我只希望一个单元格是唯一的,其余单元格通常是它们在代码中的显示方式。

var isCol = 0;
var board = [];
for (r = 0; r < 7; r++) {
  var line = [];
  for (c = 0; c < 7; c++) {
    line.push(r);
  }
  board.push(line);
}


function prs(c, r) {
  showTable(c, r);
  isCol = (isCol + 1) % 2;
}

function toColor(col, row, chosen_col, chosen_row) {
  var ret = false;
  switch (isCol) {
    case 0:
      if (row == chosen_row) {
        ret = true;
      }
      break;
    case 1:
      if (col == chosen_col) {
        ret = true;
      }
      break;
  }

  return ret;
}

function showTable(chosen_col, chosen_row) {
  var str = "";
  str += "<table border=1>";
  for (row = 0; row < 7; row++) {
    str += "<tr>";
    for (col = 0; col < 7; col++) {
      str += "<td onclick='prs(" + col + "," + row + ")'";
      if (toColor(col, row, chosen_col, chosen_row)) {
        str += " class='grn' ";
      }
      str += ">";
      str += RandomGenerator(50, 500);
      str += "</td>";
    }
    str += "</tr>";
  }
  str += "</table>";

  document.getElementById("ff").innerHTML = str;
}



function RandomGenerator(min, max) {
  return Math.floor(Math.random() * (max - min) + min);
}



showTable(-1);
td {
  border: 2px solid black;
  width: 10px;
  height: 10px;
}

td:hover {
  background-color: lightgreen;
}

.grn {
  background-color: green;
  color: white;
}
<div id='ff'></div>

最佳答案

您可以为该行创建一个 ID

<td id = "uniqueCell"> ... </td>

然后在您的 javascript 中您可以执行以下操作。

var uniqueCell = document.getElementById('uniqueCell');

然后使用那个变量做你需要做的事情

关于javascript - 如何从表格中选择某个单元格,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/60269598/

相关文章:

javascript - JavaScript 中的目标元素

javascript - OC 3.x 模板中的条件 .js 函数

javascript - 在循环中定义函数的最佳方法是什么? - JavaScript

javascript - 在故事书中用 react native 矢量图标 react native 网络问题

javascript - AngularJS - html 中的范围变量语法

javascript - 尝试通过 jQuery click() 单击外部链接来更改一个 div 的 css

html - 位置 :relative not working in IE9?

javascript - 在对象内部管理 addEventListener() 和 removeEventListener()

image - CSS:在图像周围创建白光

javascript - 在 jQuery-UI Datepicker 中选择日期范围