El siguiente código puede mostrar una sola letra aleatoria en cada cuadro. Sin embargo, una letra no debería poder aparecer en diferentes casillas al mismo tiempo que una de las casillas. Por ejemplo, el cuadro 1 muestra "A", luego los cuadros 2 y 3 no pueden mostrar "A" también.
function random() { var letter = []; for (var i = 65; i < 91; i++) { letter.push(String.fromCharCode(i)); } return letter[Math.floor(Math.random() * letter.Length)]; } function display() { document.getElementById("box1").textContent = random(); document.getElementById("box2").textContent = random(); document.getElementById("box3").textContent = random(); }Una buena manera de hacer esto sería revisar su función random para generar todas las letras a la vez, así:
function randomN(n=3) { const letters = new Set() while (letters.size < 3) { const i = Math.floor(Math.random() * (91-65)) + 65 letters.add(String.fromCharCode(i)) } return [...letters] } function display() { const [letter1, letter2, letter3] = randomN() document.getElementById("box1").textContent = letter1 document.getElementById("box2").textContent = letter2 document.getElementById("box3").textContent = letter3 }Para un enfoque más moderno, puede utilizar generadores:
function* randomLetters() { const letters = "QWERTYUIOPASDFGHJKLZXCVBNM".split('') while (letters.length > 0) { const i = Math.floor(Math.random() * letters.length) yield letters[i] letters.splice(i, 1) } } function display() { const letters = randomLetters() document.getElementById("box1").textContent = letters.next() document.getElementById("box2").textContent = letters.next() document.getElementById("box3").textContent = letters.next() /* and so on and so forth! */ }function letterGenerator(n=1) { var generated_letters = []; var alphabet = 'ABCDEFGHIJKLMNOPQRSTUVWXYZ'.split(''); for (var i=0; i<n; i++){ var random = Math.floor(Math.random() * alphabet.length); var letter = alphabet.splice(random, 1)[0]; generated_letters.push(letter) } return generated_letters; } var letters = letterGenerator(3) da Array(3) [ "Q", "T", "I" ] , por ejemplo.
al usar splice , nos aseguramos de que las letras elegidas al azar se eliminen de la variable del alphabet .
luego puede repasar las letras con for (letter of letters) o algo así, y agregar cada una al elemento deseado.
por cierto, quizás ejecute un document.querySelectorAll('[id^="box"]'); para obtener todos los elementos y agregarlos con un bucle for.
esto, junto con el parámetro n , permite cualquier número de letras generadas.
(si realmente quiere que sea genérico, cree los elementos del cuadro usando js también)
las soluciones adjuntas en los comentarios son ciertamente inteligentes. me gusto especialmente este