JSFiddle - React, Tailwind, and code Playground
CSS
table {
font-family: arial;
text-align: center;
font-size: 16px;
margin: 20px 0px 20px 0px;
border : 4px double black;
border-top : 4px solid white; /* Прячем рамку вокруг таблицы */
border-bottom : 4px solid white; /* Прячем рамку вокруг таблицы */
font-weight:normal;
}
tr {
border-width:6;
text-align: center;
}
td {
text-align: center;
padding: 8px;
width: 24px;
font-weight:normal;
}
JavaScript
// getRandom - Случайное число между min и max
// Math.random() рандомит от 0 до 1
function getRandom(min, max) {
return Math.floor(Math.random() * (max - min + 1)) + min;
}
var table = document.createElement( "table" );
document.body.appendChild( table ); m=4; n=5;
for (var i = 0; i < m; i++ ) {
var tr = document.createElement('tr');
table.appendChild(tr);
for (var j = 0; j < n; j++ ) {
var td = document.createElement('td');
td.innerHTML = getRandom(0, 6);
tr.appendChild(td);
}
}
table.id = "mytable";
var v = getRandom(3, 7); // седловая точка
var i0 = getRandom(0, m-1), j0 = getRandom(0, n-1); // коорд
for (var j = 0; j < n; j++ ) {
var td = mytable.rows[i0].cells[j];
td.innerHTML = v + getRandom(1, 3);
}
for (var i = 0; i < m; i++ ) {
var td = mytable.rows[i].cells[j0];
td.innerHTML = v - getRandom(1, 3);
}
mytable.rows[i0].cells[j0].innerHTML = v;
var button = document.createElement('input');
button.type = "button";
button.value = "Решить";
button.addEventListener( "click", function() {
findSolve()
});
document.body.appendChild(button);
var divA = document.createElement('div');
document.body.appendChild(divA);
divA.id = "divAnswer";
function findSolve() {
var table = document.getElementById( "mytable" );
var answer = 0, col = 0, row = 0;
// код решения задачи
answer = v; row = i0 + 1; col = j0 + 1;
mytable.rows[i0].cells[j0].style.backgroundColor = "green";
var divA = document.getElementById( "divAnswer" );
divA.innerHTML = "<br>Максиминная стратегия A<sub>" + row +
"</sub>;<br>Минимаксная стратегия B<sub>" + col +
"</sub>;<br>Цена игры " + answer + ".";
return false;
}