Problema con "replace" en arrays

Question

Buenas a todos, estoy tratando de usar "replace" en esto que muestro acontinuacion :

var inconvenientes1 = [ 'BACA', 'LOCA', 'BUEY', 'COLA' ];
var inconvenientes2 = [ 'BACX', 'LOCX', 'BUEX', 'COLX' ];

for(var i = 0; i<inconvenientes1.length;i++){
  var result = document.getElementById("resultado").innerHTML = custom;
  var res = result.replace(inconvenientes1[i],inconvenientes2[i]);
  document.getElementById("resultado").innerHTML = res;
}

El problema es que no me reemplaza las palabras, que puede estar mal?

Publicá el código HTML y arreglá el formateo del javascript. — azeós, Dec 19 '17 at 06:09
En la línea `var result = document...` no deberías tener al final `= custom`. Probablemente sea ese el problema, pero sin ver el HTML no puedo saberlo. — azeós, Dec 19 '17 at 06:10
Hola, ¿puedes decir que es lo que te falla? ¿Qué resultado obtienes y cual es el esperado? ¿Lanza algún error? — Edu3D, Dec 19 '17 at 08:11
Falta saber que hay, o debe haber, en el elemento con id="resultado". Porque si hay, por ejemplo, LOCA, te lo cambiará en la segunda iteración del for por LOCX, pero te lo volverá a dejar igual en la tercera y cuarta iteración — Pedro Prada, Dec 19 '17 at 08:50

score 3 · Accepted Answer · answered Dec 19 '17 at 11:32

Supongo que #resultado contiene una frase que entre medio tiene las palabras de inconvenientes1. De ser así, la manera correcta de hacer el reemplazo sería:

var inconvenientes1 = [ 'BACA', 'LOCA', 'BUEY', 'COLA' ];
var inconvenientes2 = [ 'BACX', 'LOCX', 'BUEX', 'COLX' ];

for(var i = 0; i<inconvenientes1.length;i++){
  var result = document.getElementById("resultado").innerHTML;
  var res = result.replace(inconvenientes1[i],inconvenientes2[i]);
  document.getElementById("resultado").innerHTML = res;
}

<div id="resultado">Hay una BACA que está LOCA Y al BUEY le mordió la COLA</div>

Pero hay una manera más corta:

var inconvenientes1 = [ 'BACA', 'LOCA', 'BUEY', 'COLA' ],
    inconvenientes2 = [ 'BACX', 'LOCX', 'BUEX', 'COLX' ],
    resultado = document.getElementById("resultado");

inconvenientes1.forEach(function(inconveniente,i) {
   resultado.innerHTML = resultado.innerHTML.replace(inconveniente,inconvenientes2[i]);
});

<div id="resultado">Hay una BACA que está LOCA Y al BUEY le mordió la COLA</div>

Por cierto, la BACA LOCA debiese ser VACA LOCA, pero para efectos de ser un ejemplo, supondremos que es una raza de vaca muy especial.

BACAmbiar palabras inconvenientes en un RFC de México (https://es.stackoverflow.com/q/31713/127). — Mariano, Dec 19 '17 at 23:46

score 0 · Answer 2 · answered Dec 19 '17 at 10:01

Como ha dicho @azeós en su comentario, el error que se puede ver en el pequeño trozo de código que has compartido es que asocias custom a result. Por el momento no sabemos que es la variable custom, pero lo que si te puedo decir que las instrucciones que se ejecutan son:

document.getElementById("resultado").innerHTML = custom
result = document.getElementById("resultado").innerHTML;

Por lo tanto, estás almacenando en "result" el contenido de "custom", que no tiene nada que ver con el contenido HTML que tenga el elemento con id "resultado" de la página. Segúramente este será el principal problema, y suele ocurrir por copiar y pegar sin tener mucho cuidado, a todos nos ha pasado. Es cuestión de tiempo que tengas la capacidad de verlo rápidamente, y que estos problemillas no te afecten en absoluto.

En definitiva, tendrías que modificar la línea...

var result = document.getElementById("resultado").innerHTML = custom;

Para dejarla así...

var result = document.getElementById("resultado").innerHTML;

Para que veas un ejemplo más claro de lo que te estoy diciendo, aquí tienes un ejemplo donde se hace una asignación de valor múltiple.

var objetoCustom = "PrimerMensaje"; // Este objeto no se sabe si está inicializado siquiera
var objetoHtml = "htmlInterno"; // Esto reemplazaría el código de document.getElementById("resultado").innerHTML

var result = objetoHtml = objetoCustom;
alert(result);

score 0 · Answer 3 · answered Dec 19 '17 at 14:07

Buenas amigo espero que esto sea lo que buscas.

Primero tienes que tener un texto para poder hacerle el replace la idea es hacerle el replace a la variable custom que como valor inicial le agregamos inconvenientes1[i] despues remplazamos la palabra con var res = custom2.replace(inconvenientes1[i],inconvenientes2[i]) pero fíjate bien que remplazamos buscando la palabra dentro de costom y después si agregamos al html saludos espero te ayude.

Ejemplo Funcional

var inconvenientes1 = [ 'BACA', 'LOCA', 'BUEY', 'COLA' ];
var inconvenientes2 = [ 'BACX', 'LOCX', 'BUEX', 'COLX' ];

for(var i = 0; i<inconvenientes1.length;i++){
  //Agregando solamente el texto sin cambiar la palabra 
  var custom = "hola eso es una "+inconvenientes1[i]+", "
  document.getElementById("resultado").append(custom)
  
  //Primero cambiamos el valor del texto por el deseado y despues es que se lo asignamos para agregarlo
  var custom2 = "hola eso es una "+inconvenientes1[i]+", "
  var res = custom2.replace(inconvenientes1[i],inconvenientes2[i]);
  document.getElementById("resultado2").append(res)
}

#resultado {

  background: rgb(252, 88, 88);
  padding: 10px;
}
#resultado2 {

  background: rgb(97, 252, 88);
  padding: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="resultado">

</div>
<br>
<div id="resultado2">

</div>

Problema con "replace" en arrays

3 Answers3