0

Hola estoy trabajando con diferentes archivos html, mi intención es desde un html (nombre de ejemplo: html numero 2) agregue palabras mayúsculas al array ubicado en el primer archivo js. Es para un juego. Sin embargo no logro añadir las palabras y el juego solo trabaja con las palabras incluidas en el array original.

let palabras = ['CASA','PERRO','GATO','ELEFANTE'];


function agregarPalabra(){

    let agrego = document.getElementById('texto').value.toUpperCase();

    palabras.push(agrego);

}
   //Segundo archivo html, invoco la función del primer archivo js
    <input type='text' id="texto">
   
    <input type='button' id="agregar-palabra" value = 'Guardar Palabra'onclick= 'agregarPalabra()'>


Según los comentarios el código funciona correctamente pero en mi caso no se agregan las palabras, amplio un poco más el código por si hay algo que este mal:

//Primer archivo JS (primer.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 palabras = ['CASA','PERRO','GATO','ELEFANTE'];

let palabra = palabras[Math.floor(Math.random()*palabras.length)];

//Reemplazo la palabra por guiones
let palabraConGuiones = palabra.replace(/./g, "_ ");

let contadorFallos = 7;

document.querySelector('#salida00').innerHTML = palabraConGuiones;

document.getElementById('letra00').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()

});

document.querySelector('#boton00').addEventListener('click',function(){


function agregarLetra(){

    let elementoLetra = document.createElement('span');

    elementoLetra.innerHTML = letra.toUpperCase();

    letrasUsadas.appendChild(elementoLetra);

}

let letra = document.querySelector('#letra00').value.toUpperCase();

let haFallado = true;

for(var i = 0; i < palabra.length; i++){
        
        if(letra == palabra[i]){
            
            //i*2 se debe a que la letra es reemplazada por 2 caracteres; un guión y un espacio.
            palabraConGuiones = palabraConGuiones.replaceAt(i*2, letra);
            
            haFallado = false;

          

        }
    }

if(haFallado){
    
        contadorFallos--;

        if(contadorFallos >= 0 && contadorFallos <= 7){
            document.getElementById('vida').innerHTML = 'El numero de vidas que te quedan son: ' + contadorFallos;
        //document.querySelector('#ahorcado00').style.backgroundPosition = -(173*contadorFallos) + 'px 0';
        }
        
        if(contadorFallos == 0){
            
            document.querySelector('#dead').style.display = 'inline-block';
        
        }
        }else{
            if(palabraConGuiones.indexOf('_') <0){

                document.querySelector('#parca-triste').style.display = 'inline-block';
            
            }
     
    }

   dibujar();

   limpiar();
    
   agregarLetra(letra);

});

function agregarPalabra(){

    let agrego = document.getElementById('texto').value.toUpperCase();

    palabras.push(agrego);

}
 // html esta conectado a los 2 archivos js
 
 <input type='text' id="texto">
    
    <input type='button' id="agregar-palabra" value = 'Guardar Palabra'onclick= 'agregarPalabra()'>

    <input type='button' id="mostrar-palabra" value = 'Mostrar palabras' onclick= 'mostrarPalabra()'>

      <script src='primer.js'></script>
  
      <script src="segundo.js"></script>

// Segundo archivo JS (segundo.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 = [];

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

    }

}

2
  • Tu código funciona, si escribes algo en el input se agrega. ¿Cuál es el problema?
    – A. Cedano
    Commented el 25 may. 2022 a las 20:19
  • Entonces el problema debe estar en otra parte del código, voy a tener que fijarme mejor, cualquier cosa agrego más línea de código.
    – Raul
    Commented el 25 may. 2022 a las 20:56

1 respuesta 1

2

Utiliza localStorage, así podrás guardar localmente los datos que ingreses en el arreglo.

  let palabras = ['CASA','PERRO','GATO','ELEFANTE'];
  palabras=JSON.parse(localStorage.getItem("palabras"));//Carga el arreglo json a objeto.
  function agregarPalabra(){
    let agrego = document.getElementById('texto').value.toUpperCase();
    palabras.push(agrego);
    localStorage.setItem('palabras',JSON.stringify(palabras));//Guarda el arreglo en formato JSON.
  }

Esto solo funciona localmente, podrías implementar firebase o algún pequeño servidor web ya sea php/Express.js para almacenar las palabras y puedas acceder donde sea.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.