desde hace casi una semana que estoy estancado con una parte de mi código. Voy a tratar de resumir un poco la situación. Me dieron un proyecto que tengo que realizar del juego del ahorcado, mi problema surge cuando estoy en un html distinto del original el cual debe guardar una palabra y luego iniciar el juego. Realicé la función .push(), utilicé localStorage, traté de invocar la función en diferentes lugares, moví la función de un archivo a otro y no logro obtener el resultado que quiero. Hay partes de código que voy a enseñar a continuación que están comentadas porque me daban error o simplemente no funcionan. Son 4 archivos en total, 2 html y 2 js. Sé que es un poco largo pero anteriormente formulé una pregunta con solo una parte (el array, y el push y estaba correcto). Para agregar palabras hay varios requisitos que me piden, por ejemplo, nada de caracteres especiales, el uso sólo de mayúsculas; en el primer input (id = 'letra00') puedo alterar la letra ingresada de acuerdo a los requisitos que me piden pero en el input (id = 'texto00') si pongo el mismo código para alterar los caracteres ingresados me da error. Sé que es largo pero no sé como explicar mi problema sino muestro parte de los archivos. Sepan disculpar y agradecería que alguien se tome el tiempo en ayudarme porque no puedo avanzar en el proyecto. Gracias.
//JS numero 1 (challenge02.js)
//Función para reemplazar el caracter por la letra
String.prototype.replaceAt=function(index, character) { return this.substr(0, index) + character + this.substr(index+character.length); }
let letrasUsadas = document.getElementById('letras-usadas');
let contenedorLetras = document.getElementById('contenedor-letras');
let palabras = ['CASA','PERRO','GATO'];
localStorage.setItem("palabras",palabras);
let palabra = palabras[Math.floor(Math.random()*palabras.length)];
//Reemplazo la palabra por guiones
let palabraConGuiones = palabra.replace(/./g, "_ ");
let contadorFallos = 7;
function agregarPalabra(){
let agrego = document.getElementById('texto00').value;
agrego = agrego.toUpperCase();
if(agrego !== ''){
palabras.push(agrego);
}
}
console.log(palabras);
// HTML numero 1 (challenge02.html)
<body>
<input type="text" maxlength="1" placeholder="Ingrese su Letra" id="letra00">
<button id='boton00'>Evaluar letra</button>
<p id="salida00"></p>
<div id="vida">El numero de vidas que te quedan son: 7</div>
<div>
<img src="Imagenes\DEAD.png" style="display: none;" id="dead">
<canvas id="pizarra">
Tu navegador no acepta Canvas
</canvas>
<div id="letras-usadas"></div>
<img src="Imagenes\Parca TRISTE.png" style="display: none;" id="parca-triste">
</div>
<div id="contenedor-letras"></div>
<div id="ahorcado00"></div>
<div id="ganador00">
<p>Victoria</p>
<p>Enhorabuena</p>
</div>
<script src='challenge02.js'></script>
<script src='challenge02-v2.js'></script>
<script src="dibujo-canvas.js"></script>
<script src="agregar-palabra.js"></script>
<script src="modificar-palabra.js"></script>
</body>
//JS numero 2 (agregar-palabra.js)
/*document.getElementById('texto').addEventListener('keyup', function(){
this.value = this.value.replace(/[^a-zA-Z ]/g, "")
this.value = this.value.normalize("NFD").replace(/[\u0300-\u036f]/g, "")
this.value = this.value.toUpperCase();
});*/
let datos = [];
localStorage.getItem('palabras',palabras);
/*var botonAdicionar = document.querySelector('#agregar-palabra');
botonAdicionar.addEventListener('click',function(){
let agrego = document.getElementById('texto').value.toUpperCase();
palabras.push(agrego);
});*/
/*function agregarPalabra(){
let dato = document.getElementById('texto').value.toUpperCase();
datos.push(dato);
}
*/
//localStorage.getItem('palabras');
function mostrarPalabra(){
let resultado = document.getElementById('resultado');
resultado.innerHTML = '';
for(let dato of datos){
let datoParrafo = document.createElement('p');
datoParrafo.innerText = dato;
resultado.appendChild(datoParrafo);
}
}
// HTML numero 2 (challenge02-v2-02.html)
<body>
<input type='text' id="texto00"/>
<input type='button' id="agregar-palabra" value = 'Guardar Palabra'onclick= 'agregarPalabra()'/>
<input type='button' id="mostrar-palabra" value = 'Mostrar palabras' onclick= 'mostrarPalabra()'/>
<br>
<br>
<button><a href="challenge02.html">Iniciar Juego</a></button>
<div id="resultado"></div>
<script src='challenge02.js'></script>
<script src='challenge02-v2.js'></script>
<script src="agregar-palabra.js"></script>
</body>