How to check a string starts/ends with a specific string in jQuery ?

JavaScript provides a lot of string methods that check whether a string is a substring of other string. So, jQuery wouldn’t be necessary at all to perform this task. However, we will cover all the different ways of checking whether a string starts or ends with a string:

Let’s consider a string str = "Welcome to GEEKS FOR GEEKS!!!". Now we have to find whether the string str starts with startword = "Welcome" and ends with endword = "!!!".

Approaches:
startsWith() and endsWith() method: It checks whether a string starts or ends with the specific substring.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

if (str.startsWith(startword) && str.endsWith(endword)) {
  
    // case sensitive
    console.log("Yes, The string " + str + " starts with "
            + startword + " and ends with " + endword);
}

chevron_right


search() method: It checks whether a particular string is contained in another string and returns the starting index of that substring.



Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

if (str.search(startword)==0 && 
    str.search(endword)==stringlength-endwordlength ) {
  
    // case sensitive
    console.log("Yes, The string " + str + " starts with "
            + startword + " and ends with " + endword);
}

chevron_right


indexOf() method: As the name suggests, it finds the starting index of a substring in the string.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

if (str.indexOf(startword)==0 && 
    str.indexOf(endword)==stringlength-endwordlength) {
              
    console.log("Yes, The string " + str + " starts with "
            + startword + " and ends with " + endword);
}

chevron_right


substring() method: It returns a string present between start and end index.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

if(str.substring(0, startwordlength)==startword
        && str.substring(stringlength-endwordlength,
        stringlength)==endword) {
          
    console.log("Yes, The string " + str + " starts with "
            + startword + " and ends with " + endword);
}

chevron_right


substr() method: It is similar to substring() method but takes start index and length of substring as parameters.

Eample:

filter_none

edit
close

play_arrow

link
brightness_4
code

if(str.substr(0, startwordlength)==startword
        && str.substr(stringlength-endwordlength,
        endwordlength)==endword) {
  
    console.log("Yes, The string " + str + " starts with "
            + startword + " and ends with " + endword);
}

chevron_right


slice() method: This method returns the slices of string between any two indices in a string.

Example:

filter_none

edit
close

play_arrow

link
brightness_4
code

if(str.slice(0, startwordlength)==startword
        && str.slice(stringlength-endwordlength,
        stringlength)==endword) {
  
    console.log("Yes, The string " + str + " starts with "
            + startword + " and ends with " + endword);
}

chevron_right


Let’s take an example of text in h1 element and check whether it starts and ends with the given substring.

filter_none

edit
close

play_arrow

link
brightness_4
code

<!DOCTYPE html>
<html>
  
<head>
    <title>
        How to know that a string starts/ends
        with a specific string in jQuery?
    </title>
  
    </script>
</head>
  
<body>
    <h1 id="text">
        Welcome To GEEKS FOR GEEKS!!!
    </h1>
  
    <h2>
        Check whether a word is present
        in the above sentence
    </h2>
  
    <input type="text" id="startkey">
    <input type="text" id="endkey">
    <button onclick="MyFunction()"> Check </button>
  
    <h2> startsWith() and endsWith() method </h2>
    <h2 id="startswith"> </h2>
  
    <h2> indexOf() method </h2>
    <h2 id="indexOf"></h2>
  
    <h2> search() method </h2>
    <h2 id="search"></h2>
  
    <h2> substring() method </h2>
    <h2 id="substring"></h2>
  
    <h2> substr() method </h2>
    <h2 id="substr"> </h2>
  
    <h2> slice() method </h2>
    <h2 id="slice"></h2>
  
  
    <script>
        var str = document.getElementById("text").innerText;
        stringlength = str.length;
        var startword = "";
        var endword = "";
        function MyFunction() {
            startword = document.getElementById("startkey").value;
            endword = document.getElementById("endkey").value;
            console.log(startword);
            console.log(endword)
            startwordlength = startword.length;
            endwordlength = endword.length;
  
            if (str.startsWith(startword) && str.endsWith(endword)) {
                // case sensitive 
                var h2 = document.getElementById("startswith");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with " 
                    + startword + " and ends with " + endword;
            }
            else {
                var h2 = document.getElementById("startswith");
                h2.innerHTML =
                    "No, The string " + str + 
                    " doesn't start and endwith the given words";
            }
            //Js
            if (str.indexOf(startword) == 0 && str.indexOf(
                endword) == stringlength - endwordlength) {
                var h2 = document.getElementById("indexOf");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with " 
                    + startword + " and ends with " + endword;
            }
            else {
                var h2 = document.getElementById("indexOf");
                h2.innerHTML =
                    "No, The string " + str + 
                    " doesn't start and endwith the given words";
            }
            //Js
            if (str.search(
                startword) == 0 && str.search(endword)
                    == stringlength - endwordlength) {
  
                // case sensitive 
                var h2 = document.getElementById("search");
                h2.innerHTML = "Yes, The string " + str +
                        " starts with " + startword +
                        " and ends with " + endword;
            }
            else {
                var h2 = document.getElementById("search");
                h2.innerHTML = "No, The string " + str + 
                    " doesn't start and endwith the given words";
            }
            //Js
            if (str.substring(
                0, startwordlength) == startword && str.substring(
                    stringlength - endwordlength, stringlength) == endword) {
                var h2 = document.getElementById("substring");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with " 
                    + startword + " and ends with " + endword;
            }
            else {
                var h2 = document.getElementById("substring");
                h2.innerHTML =
                    "No, The string " + str + 
                    " doesn't start and endwith the given words";
            }
  
            if (str.substr(
                0, startwordlength) == startword && str.substr(
                    stringlength - endwordlength, endwordlength) == endword) {
                var h2 = document.getElementById("substr");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with " 
                    + startword + " and ends with " + endword;
            }
            else {
                var h2 = document.getElementById("substr");
                h2.innerHTML =
                    "No, The string " + str + 
                    " doesn't start and endwith the given words";
            }
            if (str.slice(
                0, startwordlength) == startword && str.slice(
                    stringlength - endwordlength, stringlength) == endword) {
                var h2 = document.getElementById("slice");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with "
                    startword + " and ends with " + endword;
            }
            else {
                var h2 = document.getElementById("slice");
                h2.innerHTML =
                    "No, The string " + str + 
                    " doesn't start and endwith the given words";
            }
        }
    </script>
</body>
  
</html>

chevron_right


Output:

full-stack-img




My Personal Notes arrow_drop_up

Check out this Author's contributed articles.

If you like GeeksforGeeks and would like to contribute, you can also write an article using contribute.geeksforgeeks.org or mail your article to contribute@geeksforgeeks.org. See your article appearing on the GeeksforGeeks main page and help other Geeks.

Please Improve this article if you find anything incorrect by clicking on the "Improve Article" button below.