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);
}
}
input
se agrega. ¿Cuál es el problema?