Создать уникальную ячейку в сгенерированной таблице

Question

стол обновлялся раньше, теперь нет. Теперь, проверьте новый фрагмент кода, и какую главную цель я пытаюсь достичь (объяснено в последнем комментарии), я верю, что этот новый фрагмент поможет прояснить то, что я ищу. извините, что беспокою вас много, но очень ценю помощь: D

var isCol = 0;
var board = [];
for (r = 0; r < 7; r++) {
  var line = [];
  for (c = 0; c < 7; c++) {
    line.push(RandomGenerator(50, 500));
  }
  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 += board[row][col];
      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>

Answer 1

Я не уверен, в чем смысл «щелчка» по одной из ячеек. Итак, давайте сохраним ваш код как есть. Единственное изменение - последние несколько строк о том, как выбрать / установить уникальную ячейку таблицы как уникальную ...

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;
  getUnique();
}



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);

/* keep your code as is for now and add the following lines */
var getUnique = function(){
  var tdElements = document.querySelectorAll('#ff td');
  tdElements[
    RandomGenerator(0, tdElements.length)
  ].classList.add('uniqueCell')
};
getUnique();

td{
border:2px solid black;
width:10px;
height:10px;
}
td:hover{background-color:lightgreen;}
.grn{
background-color:green;
color:white;
}

.uniqueCell {
  background-color: fuchsia;
}

<div id='ff'></div>