HTML Javascript 숫자야구 게임

숫자야구 게임을 만들어 봤습니다. 영어로는 Bulls and Cows 라고 하네요. 3 ~ 5 자리수 게임을 선택할 수 있습니다. 게임이 끝나도 버튼을 누르면 새 게임이 시작됩니다.
순서	숫자	결과
<!DOCTYPE html>

<style>
#myInput { font-size: 16px; padding: 4px; width: 100px; }
#myTable { width: 100%; max-width: 400px; text-align: center; 
  border-collapse: collapse; }
#myTable, #myTable th, #myTable td { 
  border: 1px solid lightgray; }
#myTable th, #myTable td { padding: 4px; }
#myTable th { color: white; background: #aaa; }
#myTable tr:nth-child(odd) { background: #eee; }
#myTable .ok { color: dodgerblue; background: #def !important; }
#myTable .error { color: tomato; }
.startBtn { 
  display: inline-block; padding: 4px; border: 3px solid #ccc;
  color: #ccc;  font-weight: bold; text-decoration: none; 
}
.startBtn:hover { background: #fee; }
.startBtn.active { border-color: #fab; color: #fab; }
</style>

<div style="margin: 30px 0;">
  <a id="start3" class="startBtn" href="javascript:void(0)"
    role="button" onclick="startGame(3)">3자리</a>
  <a id="start4" class="startBtn" href="javascript:void(0)"
    role="button" onclick="startGame(4)">4자리</a>
  <a id="start5" class="startBtn" href="javascript:void(0)"
    role="button" onclick="startGame(5)">5자리</a>
</div>

<div style="margin: 30px 0;">
  <input id="myInput" type="text" maxlength="5"
    onkeydown="input(event.keyCode)">
  <button style="padding:4px" onclick="input(ENTER)">입력</button>
</div>

<table id="myTable">
  <tr>
    <th style="width: 15%;">순서</th>
    <th>숫자</th>
    <th>결과</th>    
  </tr>  
</table>

<script>

var inputElem = document.getElementById("myInput");
var tableElem = document.getElementById("myTable");
const ENTER = 13;
var quizLen, quiz, count;
startGame(3);

function startGame(len) {  
  document.querySelectorAll(".startBtn").forEach(elem => {
    elem.classList.remove("active");
  });  
  document.getElementById("start" + len).classList.add("active");

  quizLen = len;
  quiz = nbbCreateNumber(quizLen);
  count = 0;
  // console.log(quiz);

  var ths = tableElem.firstElementChild;
  tableElem.innerHTML = "";
  tableElem.appendChild(ths);
  for (var i = 1; i <= 7; i++) {
    var tr = document.createElement("tr");
    tr.innerHTML = `<td>${i}</td><td></td><td></td>`
    tableElem.appendChild(tr);
  }

  inputElem.value = "";
  inputElem.focus();
}

function input(key) {  
  if (key != ENTER) return;
  
  if (inputElem.value.trim()) tryNumber();
  inputElem.value = "";
  inputElem.focus();
}

function tryNumber() {
  count++;
  var tr = document.createElement("tr");
  tr.innerHTML = "<td>" + count + "</td>";
  
  var num = Number(inputElem.value);
  if (nbbCheckNumber(num, quizLen)) {
    var bs = nbbCheckBs(num, quiz);
    tr.innerHTML += "<td>" + num + "</td>"; 
    if (bs.s == quizLen) { 
      tr.innerHTML += "<td>O.K.</td>"
      tr.className = "ok"; 
    }
    else {
      tr.innerHTML += `<td>B: ${bs.b}, S: ${bs.s}</td>`;
    }
  }
  else {
    tr.innerHTML += "<td>" + inputElem.value + "</td>" + 
      "<td>Error</td>";
    tr.className = "error";
  }
     
  if(count < tableElem.childElementCount) {
    tableElem.children[count].replaceWith(tr);
  }
  else tableElem.appendChild(tr);
}

function nbbCreateNumber(len) {
  var ar = [0, 1, 2, 3, 4, 5, 6, 7, 8, 9];
  while (ar[0] == 0) shuffle(ar);
  return Number(ar.slice(0, len).join(""));
}

function nbbCheckNumber(n, len) {
  if (!Number.isInteger(n)) return false;
  if (n < 0) return false;
  var s = n.toString();
  if (s.length != len) return false;
  if (new Set(s).size != len) return false;
  return true;
}

function nbbCheckBs(n1, n2) {
  var s1 = n1.toString();
  var s2 = n2.toString();
  var bs = { b:0, s:0 };
  
  for (var i = 0; i < s1.length; i++) {
    for (var j = 0; j < s2.length; j++) {
      if (s1[i] == s2[j]) {
        if (i == j) bs.s++;
        else bs.b++;
      }
    }
  }

  return bs;
}

function shuffle(ar) {
  for (var i = ar.length - 1; i > 0; i--) {
    var r = Math.floor(Math.random() * (i + 1)); // 0 ~ i
    [ar[i], ar[r]] = [ar[r], ar[i]];
  }
}

</script>