The ignoreCase property in JavaScript is used to determine whether the "i" modifier is present or not, returning a Boolean value accordingly. When the "i" modifier is active, the property evaluates to true; otherwise, it evaluates to false. This property enables case-insensitive operations on the data.
Syntax
The syntax below is employed to retrieve the index that precedes the beginning of the next value.
regexObject.ignoreCase;
Supported Browsers
The following browsers work for RegExp ignoreCase properties:
- Google Chrome
- Edge
- Firefox
- Internet Explorer
- Opera
- Safari
Examples
Below are instances that demonstrate the utilization of the "i" modifier.
Example 1:
The illustration demonstrates the utilization of the case-insensitive flag through the ignoreCase attribute. In this scenario, we implement regular expressions directly by incorporating the ignoreCase flag.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp ignoreCase properties
</title>
<style>
#demo1 {
background-color: aqua;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp ignoreCase properties
</h3>
<h4> The ignoreCase property gets the available of the "i" modifier </h4>
<!-- Click the button to get the ignoreCase properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_ignoreCase"> </div>
</div>
<script>
function display_value() {
let ignoreCase_pattern = /j/gi;
var final_result = "";
//Get available the case-insensitive modifier with the ignoreCase keyword
final_result += "Available ignoreCase: " + ignoreCase_pattern.ignoreCase + "<br>";
//output shows "true" as a ignoreCase output
var ele_demo = document.getElementById("regex_ignoreCase");
ele_demo.innerHTML = final_result;
}
</script>
</body>
</html>
Output
The result indicates the presence of the case-insensitive flag.
Example 2:
The following example demonstrates how the array function determines the final occurrence of the specified character while considering the ignoreCase property.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp ignoreCase properties
</title>
<style>
#demo1 {
background-color: aqua;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp ignoreCase properties
</h3>
<h4> The ignoreCase property gets the available of the "i" modifier </h4>
<!-- Click the button to get the ignoreCase properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_ignoreCase"> </div>
</div>
<script>
function display_value() {
let ignoreCase_pattern = /j/g;
var final_result = "";
//Get available the case-insensitive modifier with the ignoreCase keyword
final_result += "Available ignoreCase: " + ignoreCase_pattern.ignoreCase + "<br>";
//output shows "false" as a ignoreCase output
var ele_demo = document.getElementById("regex_ignoreCase");
ele_demo.innerHTML = final_result;
}
</script>
</body>
</html>
Output
The result indicates the presence of the case-insensitive flag.
Example 3:
In this demonstration, the final occurrence of the character that matches the ignoreCase property within a string is illustrated. The approach involves employing the Regexp function with the specified regex format.
<!DOCTYPE html>
<html>
<head>
<title>
JavaScript RegExp ignoreCase properties
</title>
<style>
#demo1 {
background-color: aqua;
border: 1px solid black;
width: 370px;
}
</style>
</head>
<body>
<div id = "demo1">
<h3>
JavaScript RegExp ignoreCase properties with new Regexp() method
</h3>
<h4> The ignoreCase property gets the available of the "gi" modifier </h4>
<!-- Click the button to get the ignoreCase properties output -->
<button onclick = "display_value();"> Click Here! </button>
<div id = "regex_ignoreCase"> </div>
</div>
<script>
function display_value() {
let ignoreCase_pattern = new RegExp("j", "gi");
var final_result = "";
//Get available the case-insensitive modifier with the ignoreCase keyword
final_result += "Available ignoreCase: " + ignoreCase_pattern.ignoreCase + "<br>";
//output shows "false" as a ignoreCase output
var ele_demo = document.getElementById("regex_ignoreCase");
ele_demo.innerHTML = final_result;
}
</script>
</body>
</html>
Output
The result indicates the presence of the case-insensitive flag.
Conclusion
The ignore case feature in regex is designed to handle both uppercase and lowercase variations of characters. This property enables developers to efficiently manage large databases and effectively filter values for users.