In this article I will share with you a sample program that demonstrate the concept of Palindrome what is a palindrome? a palindrome can refer to a series of numbers or words that when we read forward and backward the spelling is the same examples of palindrome is ANA, MADAM, RADAR and many others. I implement the palindrome concept using JavaScript as my programming language. The code is very simple and easy to understand ideal for those people that are new in JavaScript programming.
If you have some questions please send me an email at jake.r.pomperada@gmail.com and jakerpomperada@yahoo.com. My mobile number here in the Philippines is 09173084360.
Sample Program Output
Program Listing
<!DOCTYPE html>
<html>
<head>
<meta charset="ISO-8859-1">
<title>Palindrome in JavaScript</title>
<style>
b {
font-family:arial;
color:blue;
font-size:18px;
}
input[type="text"] {
display: block;
margin: 0;
width: 35%;
font-family: arial;
font-size: 18px;
appearance: none;
border-radius: 2px;
box-shadow: 10px 10px 7px #888888;
}
input[type="text"]:focus {
outline: none;
}
input[type=button] {
padding:12px 31px;
background:yellow; border:10px;
cursor:pointer;
-webkit-border-radius: 12px;
box-shadow: 10px 10px 7px #888888;
border-radius: 5px;
font-family: arial;
font-size: 18px;
}
</style>
</head>
<body bgcolor="lightgreen">
<script>
function start_palindrome()
{
var strings = document.getElementById('userInput').value;
var result = palindrome_checker(strings);
alert('The String is "'+strings +'" is '+result+'.');
}
function palindrome_checker(strings)
{
var orignal_word;
var reverse_word = strings;
strings = strings.toLowerCase();
orignal_word = strings;
strings = strings.split('');
strings = strings.reverse();
strings = strings.join('');
if(orignal_word == reverse_word)
{
return 'A PALINDROME';
}
else
{
return 'NOT A PALINDROME';
}
}
function clear_now()
{
document.getElementById('userInput').value="";
document.getElementById('userInput').focus();
}
</script>
<b> Palindrome in JavaScript </b> <br><br>
<form name="myform" action="">
<b>Please enter a word or a string</b><br><br>
<input type='text' id='userInput' placeholder="enter text here" value='' size="30" required/>
<br><br>
<input type='button' onclick='start_palindrome()' title="Click here to count the vowels and consonants" value='OK'/>
<input type='button' onclick='clear_now()' title="Click here to clear the textbox." value='CLEAR'/>
</form>
<br>
</body>
</html>
