Open In App

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

Improve
Improve
Like Article
Like
Save
Share
Report

JavaScript provides a lot of string methods that check whether a string is a substring of another 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: 

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

Syntax:

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

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

Syntax:

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);
}

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

Syntax:

if (str.indexOf(startword)==0 && 
str.indexOf(endword)==stringlength-endwordlength) {

console.log("Yes, The string " + str + " starts with "
+ startword + " and ends with " + endword);
}

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

Syntax:

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);
}

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

Syntax:

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);
}

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

Syntax:

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);
}

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

HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>
        How to know that a string starts/ends
        with a specific string in jQuery?
    </title>
 
    <script src=
    </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>
        let str = document.getElementById("text").innerText;
        stringlength = str.length;
        let startword = "";
        let 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
                let h2 = document.getElementById("startswith");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with "
                    + startword + " and ends with " + endword;
            }
            else {
                let 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) {
                let h2 = document.getElementById("indexOf");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with "
                    + startword + " and ends with " + endword;
            }
            else {
                let 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
                let h2 = document.getElementById("search");
                h2.innerHTML = "Yes, The string " + str +
                    " starts with " + startword +
                    " and ends with " + endword;
            }
            else {
                let 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) {
                let h2 = document.getElementById("substring");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with "
                    + startword + " and ends with " + endword;
            }
            else {
                let 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) {
                let h2 = document.getElementById("substr");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with "
                    + startword + " and ends with " + endword;
            }
            else {
                let 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) {
                let h2 = document.getElementById("slice");
                h2.innerHTML =
                    "Yes, The string " + str + " starts with " +
                    startword + " and ends with " + endword;
            }
            else {
                let h2 = document.getElementById("slice");
                h2.innerHTML =
                    "No, The string " + str +
                    " doesn't start and endwith the given words";
            }
        }
    </script>
</body>
 
</html>


Output: 

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

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



Last Updated : 13 Jul, 2023
Like Article
Save Article
Previous
Next
Share your thoughts in the comments
Similar Reads