Build a Palindrome Checker Project - Build a Palindrome Checker

I don’t know what to do when the input has more than one word. For example:

  1. When the #text-input element contains the text 1 eye for of 1 eye. and the #check-btn element is clicked, the #result element should contain the text 1 eye for of 1 eye. is not a palindrome
  2. When the #text-input element contains the text 0_0 (: /-\ :) 0-0 and the #check-btn element is clicked, the #result element should contain the text 0_0 (: /-\ :) 0-0 is a palindrome
  3. When the #text-input element contains the text five|\_/|four and the #check-btn element is clicked, the #result element should contain the text five|\_/|four is not a palindrome
<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <link rel="stylesheet" href="styles.css" />
    <title>Palindrome</title>
  </head>
  <body>
    <main>

<div>
<input id="text-input"/>
<button id="check-btn">Check</check>
</div>
<div id="result"></div>
</main>
<script src="script.js"></script>
</body>
</html>

/* file: styles.css */

/* file: script.js */
const textInput = document.getElementById("text-input");
const checkButton = document.getElementById("check-btn");

checkButton.addEventListener("click", function() {
  const str = textInput.value;

  if (str === null || str.trim() === "") {
    alert("Please input a value");
  } else {
    function palindrome(str) {
      const newStr = str.toLowerCase().replace(/[^a-z\d]/g, '');
      const reversedStr = newStr.split('').reverse().join('');

      if (newStr === reversedStr) {
        return `${newStr} is a palindrome`;
      } else {
        return `${newStr} is not a palindrome`;
      }
    }
const result = document.getElementById("result");
    result.innerHTML = palindrome(str);
    
  }
});

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/120.0.0.0 Safari/537.36

Challenge Information:

Build a Palindrome Checker Project - Build a Palindrome Checker

I think the String replace() method should remove the spaces too from the input value, then you reverse and compare as usual

1 Like

Thanks, I solved it…

1 Like

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.