Compare the Case Insensitive strings in JavaScript

22 Apr, 2019
Comparing strings in a case insensitive manner means to compare them without taking care of the uppercase and lowercase letters. To perform this operation the most preferred method is to use either toUpperCase() or toLowerCase() function.
toUpperCase() function: The str.toUpperCase() function converts the entire string to Upper case. This function does not affect any of the special characters, digits and the alphabets that are already in upper case.Syntax:string.toUpperCase()
Syntax:
string.toUpperCase()
toLowerCase() function: The str.toLowerCase() function converts the entire string to lower case. This function does not affect any of the special characters, digits and the alphabets that are already in the lower case.Syntax:string.toLowerCase()
Syntax:
string.toLowerCase()
Example 1: This example uses toUpperCase() function to compare two strings.
<!DOCTYPE html> <html>   <head>     <title>         JavaScript | Case insensitive        string comparison    </title> </head>           <body style = "text-align:center;">     <h1 style = "color:green;" >         GeeksForGeeks     </h1>           <p id="GFG_up" style="color:green;"></p>          <button onclick = "myGeeks()">         Click here     </button>               <p id="GFG_down" style="color:green;"></p>                  <script>         var str1 = "this iS geeksForGeeKs";        var str2 = "This IS GeeksfOrgeeks";        var p_up = document.getElementById("GFG_up");        p_up.innerHTML = str1 + "<br>" + str2;                  function myGeeks() {            var p_down = document.getElementById("GFG_down");            var areEqual = str1.toUpperCase() === str2.toUpperCase();            p_down.innerHTML = areEqual;        }     </script> </body>   </html>                    
Output:
Before clicking on the button:
After clicking on the button:
Example 2: This example uses toLoweCase() function to compare two strings.
<!DOCTYPE html> <html>   <head>     <title>         JavaScript | Case insensitive        string comparison    </title> </head>           <body style = "text-align:center;">     <h1 style = "color:green;" >         GeeksForGeeks     </h1>           <p id="GFG_up" style="color:green;"></p>          <button onclick = "myGeeks()">         Click here     </button>               <p id="GFG_down" style="color:green;"></p>                  <script>         var str1 = "this iS geeks";        var str2 = "This IS GeeksfOrgeeks";        var p_up = document.getElementById("GFG_up");        p_up.innerHTML = str1 + "<br>" + str2;                  function myGeeks() {            var p_down = document.getElementById("GFG_down");            var areEqual = str1.toLowerCase() === str2.toLowerCase();            p_down.innerHTML = areEqual;        }     </script> </body>   </html>                    
Output:
Before clicking on the button:
After clicking on the button:
JavaScript-Misc
javascript-string
JavaScript
Web Technologies
Web technologies Questions
Writing code in comment?
Please use ide.geeksforgeeks.org,
generate link and share the link here.
Difference between var, let and const keywords in JavaScript
Differences between Functional Components and Class Components in React
Remove elements from a JavaScript Array
Hide or show elements in HTML using display property
Roadmap to Learn JavaScript For Beginners
Installation of Node.js on Linux
Top 10 Projects For Beginners To Practice HTML and CSS Skills
Difference between var, let and const keywords in JavaScript
How to insert spaces/tabs in text using HTML/CSS?
How to fetch data from an API in ReactJS ?