Javascript regex groups (a|b) for alternative

Javascript regex groups [a|b] work for alternative numbers or characters available as a character in the string. We can use the numbers or any character as an alternative value to operate the required character using the regex method. The test, search, and match method works with the regex group value with the standing line with the value.

Syntax

The following syntax is used to regex groups for alternative characters.

Description

The modifier is optional but necessary to operate entire string data.
We can use multiple values as an alternative group's data.

Examples

The following examples show the alternative character group of the javascript regex.

Example 1

The following example works for the alternative string as a character using a regex group.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [j|w] number does not as an character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here! </button>
    </div>
    <script>
        function display_group() {
            // Use regex alternative group character with global modifier
            let input_pattern = /[[j|w]/g;
            var group_t1 = input_pattern.test('javatpoint website');
            var group_t2 = input_pattern.test('javascript');
            var group_t3 = input_pattern.test('websites for learning');
            // Output shows the Boolean value of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = "javatpoint website : " + group_t1 + "<br> javascript: " + group_t2 +
                " <br> websites for learning: " + group_t3
        }
    </script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Javascript regex groups (a|b) for alternative

Example 2

The following example matches for alternative string as a character using a regex group.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [j|w] number does not as a character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here! </button>
    </div>
    <script>
        function display_group() {
            // Use regex alternative group character with global modifier
            let input_pattern = /[[j|w]/g;
            var group_input1 = "javatpoint website";
            var group_input2 = "javascript";
            var group_input3 = "website to learn";
            var group_alter1 = group_input1.match(input_pattern);
            var group_alter2 = group_input2.match(input_pattern);
            var group_alter3 = group_input3.match(input_pattern);
            // Output shows the available value of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = "javatpoint website : " + group_alter1 + "<br> javascript : " + group_alter2 +
                " <br> website to learn : " + group_alter3;
        }
    </script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Example 3

The following example matches the [j|w|a|t] values using javascript regex. We can use multiple characters to match strings using the regex group.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [a|j|w|t] number does not as an character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here! </button>
    </div>
    <script>
        function display_group() {
            // Use multiple alternative group characters with a global modifier
            let input_pattern = /[a|j|w|t]/g;
            var group_input1 = "javatpoint website";
            var group_input2 = "javascript";
            var group_input3 = "website to learn";
            var group_alter1 = group_input1.match(input_pattern);
            var group_alter2 = group_input2.match(input_pattern);
            var group_alter3 = group_input3.match(input_pattern);
            // Output shows the matching value of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = "javatpoint website : " + group_alter1 + "<br> javascript : " + group_alter2 +
                " <br> website to learn : " + group_alter3;
        }
    </script>
</body>
</html>

Output

The output shows a given alternative character from the input string.

Example 4

The following example searches the required numbers of the string.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [a|j|w|t] number does not as an character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here! </button>
    </div>
    <script>
        function display_group() {
            // Use regex alternative group character with search method
            let input_pattern = /[a|t]/g;
            var group_input1 = "javatpoint website";
            var group_input2 = "javascript";
            var group_input3 = "website to learn";
            var group_alter1 = group_input1.search(input_pattern);
            var group_alter2 = group_input2.search(input_pattern);
            var group_alter3 = group_input3.search(input_pattern);
            // Output shows the index value of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = "javatpoint website : " + group_alter1 + "<br> javascript : " + group_alter2 +
                " <br> website to learn : " + group_alter3;
        }
    </script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Example 5

The following example shows the availability of the alternative character in the form of numbers.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [0|1] number does not as an character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here!</button>
    </div>
    <script>
        function display_group() {
            // Use the regex alternative group's number with the search method
            let input_pattern = /[0|1]/g;
            var group_input1 = "98011";
            var group_input2 = "22341";
            var group_input3 = "2002132";
            var group_alter1 = group_input1.search(input_pattern);
            var group_alter2 = group_input2.search(input_pattern);
            var group_alter3 = group_input3.search(input_pattern);
            // Output shows the index position of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = "98011 : " + group_alter1 + "<br> 22341 : " + group_alter2 + " <br> 2002132 : " +
                group_alter3;
        }
    </script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Example 6

The following example matches the alternative character of the numbers.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>

<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [0|1|2] number does not as an character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here!</button>
    </div>
</body>
</body>
<script>
    function display_group() {
        // Use multiple alternative group numbers with the search method
        let input_pattern = /[0|1|2]/g;
        var group_input1 = "98011";
        var group_input2 = "22341";
        var group_input3 = "2002132";
        var group_alter1 = group_input1.match(input_pattern);
        var group_alter2 = group_input2.match(input_pattern);
        var group_alter3 = group_input3.match(input_pattern);
        // Output shows the available value of the regex pattern
        var ele = document.getElementById("regex_group");
        ele.innerHTML = "98011 : " + group_alter1 + "<br> 22341 : " + group_alter2 + " <br> 2002132 : " + group_alter3;
    }
</script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Example 7

The following example matches the [j|w|a|t] values using javascript regex. We can use multiple characters with global and case-insensitive modifiers to match strings using the regex group.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the [a|j|w|t] number does not as a character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here! </button>
    </div>
    <script>
        function display_group() {
            // Use regex alternative group character with modifiers
            let input_pattern = /[a|j|w|t]/gi;
            var group_input1 = "javatpoint website for Javascript";
            var group_input2 = "javascript Tutorial";
            var group_input3 = "Website to Learn";
            var group_alter1 = group_input1.match(input_pattern);
            var group_alter2 = group_input2.match(input_pattern);
            var group_alter3 = group_input3.match(input_pattern);
            // Output shows the available value of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = "javatpoint website : " + group_alter1 + "<br> javascript : " + group_alter2 +
                " <br> website to learn : " + group_alter3;
        }
    </script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Example 8

The following example filters particular values from the array. We can use multiple characters or array objects in regex.

<!DOCTYPE html>
<html>
<head>
    <title>
        JavaScript RegExp groups
    </title>
    <style>
        #demo1 {
            background-color: orange;
            border: 1px solid black;
            width: 370px;
        }
    </style>
</head>
<body>
    <div id="demo1">
        <h3>
            JavaScript RegExp groups for alternative characters
        </h3>
        <h4> the regex group test the (php|jquery) number does not as an character
        </h4>
        <div id="regex_group"></div>
        <!-- Click the button to get an alternative value -->
        <button onclick="display_group ();"> Click Here! </button>
    </div>
    <script>
        function display_group() {
            // Use alternative group value with global modifier
            let input_pattern = /(php|jquery)/g;
            var group_input1 = "java, php, jquery, javascript, nodejs";
            var group_alter1 = group_input1.match(input_pattern);
            // Output shows the available value of the regex pattern
            var ele = document.getElementById("regex_group");
            ele.innerHTML = group_alter1;
        }
    </script>
</body>
</html>

Output

The output shows the given alternative character from the input string.

Conclusion

Javascript regular expression groups are used for alternative data and information. we can use to filter for particular values. it is an easy way to operate information using search, match and test methods.

Next TopicJavaScript RegExp \0 Metacharacter

← prev next →