2

Tengo la siguiente función creada en JavaScript para determinar si una palabra es palíndromo o no lo es, pero no me arroja los resultados en un párrafo el cual modifico mediante innerHTML.

Debería funcionar así:

introducir la descripción de la imagen aquí

Al ingresar la palabra en la casilla respectiva en el input text, doy clic en el botón validar y donde dice resultado me debe reemplazar por "Es palíndromo" o "No es palíndromo" pero no funciona y tampoco me da error.

var btn = document.getElementById("boton");

function esPalindromo(texto) {
  var palabra = document.getElementById("Palabra").value;
  if (palabra == "") {
    alert("Escribe la Palabra");
  }
  texto = document.getElementById("Palabra").value;
  let array = texto.split("");
  let reverse = array.reverse();

  return texto == reverse.join("") ? "Si es P" : "No es P"

  if (texto == "Si es P") {
    document.getElementById('Resultado').innerHTML = 'Es Palindromo';
  } else {
    document.getElementById('Resultado').innerHTML = "No es Palindromo";
  }
}

btn.addEventListener("click", esPalindromo, true);
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <main>
    <span>Validar Palindromo </span>
    <input type="text" id="Palabra" placeholder="Ingresa Palabra">
    <button id="boton"> validar </button>
    <br>
    <br>
    <p id="Resultado">Resultado.....</p>
  </main>
  <script src="./javas.js">
  </script>
</body>

</html>

1 respuesta 1

4

El que no se muestre el texto en el html radica en que tienes un return en la función justo antes de que se llame a ELEMENTO.innerHTML, por ende no da error pero tampoco mostrara el texto.

De igual manera tienes algunos detalles a modificar en dicha funcion:

  • Tu funcion recibe como argumento texto que recibe el evento, pero dentro de la misma no utilizas dicho parametro para esos fines, es mas lo reasignas al valor del input.

Tomando en consideracion dichos detalles te dejo abajo las modificaciones:

let btn = document.getElementById("boton");

function esPalindromo() {
    const palabra = document.getElementById("Palabra").value;
    if (palabra == "") {
        alert("Escribe la Palabra");
        return
    }
    const reverse = palabra.split("").reverse();
    const result = palabra === reverse.join("") ? "Es Palindromo" : "No es Palindromo";
    document.getElementById('Resultado').innerHTML = result
}
btn.addEventListener("click", esPalindromo, true);
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>

<body>
  <main>
    <span>Validar Palindromo </span>
    <input type="text" id="Palabra" placeholder="Ingresa Palabra">
    <button id="boton"> validar </button>
    <br>
    <br>
    <p id="Resultado">Resultado.....</p>
  </main>
  <script src="./javas.js">
  </script>
</body>

</html>

2
  • Muchisimas Gracias GMrYael, asi lo pude solucionar
    – Jose Leon
    el 18 nov. 2022 a las 1:55
  • Que bueno saber que fue de utilidad la respuesta, solo te recomiendo que tengas más cuidados con los detalles que te comenté!!
    – GmrYael
    el 18 nov. 2022 a las 2:13

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.