JavaScript methods to increment/decrement alphabetical letters - GeeksforGeeks

31 Jul, 2019
The task is to increment/decrement alphabetic letters using ASCII value with the help of JavaScript.
Approach:
Use charCodeAt() method to return the Unicode of the character at the specified index in a string
Increment/Decrement the ASCII value depending on the requirement.
Use fromCharCode() method to convert Unicode values into characters.
Example 1: In this example, the character ‘a’ is incremented by clicking on the button.
<!DOCTYPE HTML> <html>   <head>     <title>         JavaScript method to increment/        decrement letters    </title></head>  <body style = "text-align:center;">          <h1 style = "color:green;">         GeeksForGeeks     </h1>          <p id = "GFG_UP" style =         "font-size: 15px; font-weight: bold;">    </p>          <button onclick = "GFG_Fun()">        click here    </button>          <p id = "GFG_DOWN" style =         "color:green; font-size: 20px; font-weight: bold;">    </p>          <script>         var up = document.getElementById('GFG_UP');        var down = document.getElementById('GFG_DOWN');                  up.innerHTML = "Click on the button to increment "                    + "the letter.";        down.innerHTML = 'a';                  function nextCharacter(c) {            return String.fromCharCode(c.charCodeAt(0) + 1);        }                  function GFG_Fun() {            var c = down.innerHTML;            down.innerHTML = nextCharacter(c);        }    </script> </body>   </html>
Output:
Before clicking on the button:
After clicking on the button:
Example 2: In this example, the character ‘z’ is decremented by clicking on the button.
<!DOCTYPE HTML> <html>   <head>     <title>         JavaScript method to increment/        decrement letters    </title></head>  <body style = "text-align:center;">           <h1 style = "color:green;">         GeeksForGeeks     </h1>          <p id = "GFG_UP" style =         "font-size: 15px; font-weight: bold;">    </p>          <button onclick = "GFG_Fun()">        click here    </button>          <p id = "GFG_DOWN" style =         "color:green; font-size: 20px; font-weight: bold;">    </p>          <script>         var up = document.getElementById('GFG_UP');        var down = document.getElementById('GFG_DOWN');                  up.innerHTML = "Click on the button to decrement "                    + "the letter.";        down.innerHTML = 'z';                  function nextCharacter(c) {            return String.fromCharCode(c.charCodeAt(0) - 1);        }                  function GFG_Fun() {            var c = down.innerHTML;            down.innerHTML = nextCharacter(c);        }    </script> </body>   </html>
Output:
Before clicking on the button:
After clicking on the button:
JavaScript-Misc
JavaScript
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Comments
Old Comments
Difference between var, let and const keywords in JavaScript
Difference Between PUT and PATCH Request
Remove elements from a JavaScript Array
How to get character array from string in JavaScript?
How to get selected value in dropdown list using JavaScript ?
Top 10 Front End Developer Skills That You Need in 2022
Installation of Node.js on Linux
Top 10 Projects For Beginners To Practice HTML and CSS Skills
How to fetch data from an API in ReactJS ?
How to insert spaces/tabs in text using HTML/CSS?