Search Word or Substring from Paragraph or String using JavaScript and JQuery

string operation using javascript or jquery
InfoPath alternatives for form designing SharePoint

In this article we will learn how to search and locate the words or substrings in the paragraphs or large strings. We will achieve this by using both JavaScript and JQuery.

Scenarios:
Sometimes we come across a requirement where we need to find the substrings in a paragraph, we have a couple of scenarios which we are going to look into to achieve it.
1. How to find if a word or a substring is present in the given string?
2. How to find a position of a particular word or a string in the given string?
3. How to find a string and replace it with some other string?
4. How to find the number of occurrences of a particular word or a string in a given string or paragraph?
5. How to find the single or multiple paragraphs which have the required word or string?

1. How to find if a word or a substring is present in the given string?

In this case we will use the includes() method which determines whether a string contains the specified word or a substring. If the word or substring is present in the given string the includes() method returns true otherwise it returns false.

The includes() method is case sensitive.
This method do search the string, also it has got flexibility to identify the starting position of the search.

Note: includes() method is not supported in IE11
Code:

a. Search the entire string.




<script language=”javascript”>

var strng;

strng = “Either way, time largely defines the human experience.”;

var incStr = strng.includes(“human”);

document.write(“Is ‘human’ present in the string? : ” + incStr );

</script>

Output:

How to find if a word or a substring is present in the given string
How to find if a word or a substring is present in the given string

b. Search with the specified start position.

Case 1: Starting Point of search is before ‘h’ in the word “human”.

<script language=”javascript”>

var strng;

strng = “Either way, time largely defines the human experience.”;

var incStr = strng.includes(“human”,10);

document.write(“Is ‘human’ present in the string? : ” + incStr );

</script>

Output:

How to find a position of a particular word or a string in the given string
How to find a position of a particular word or a string in the given string

Case 2: Starting Point of search is after ‘h’ in the word “human”.

<script language=”javascript”>

var strng;

strng = “Either way, time largely defines the human experience.”;

var incStr = strng.includes(“human”,38);

document.write(“Is ‘human’ present in the string? : ” + incStr );

</script>

Output


How to find a string and replace it with some other string
How to find a string and replace it with some other string

2. How to find a position of a particular word or a substring in the given string?

We can achieve this by using a Regular Expression, regular expressions provides us the text search functionality with its string method: search() which uses an expression to search for a match and returns the starting position of the desired word or substring.
We can use the search() method with either regular expression or string as an argument.

Code:

a. String as an argument

<script language=”javascript”>

var strng;

strng = “Is time an illusion created within our minds? Or is it a dimension of the physical universe? Either way,time largely defines the human experience.”;

var position = strng.search(“illusion”);

document.write(“Desired String is present at position : ” + position);

</script>

b. Regular Expression as an argument

<script language=”javascript”>

var strng;

strng = “Is time an illusion created within our minds? Or is it a dimension of the physical universe? Either way,time largely defines the human experience.”;

var position = strng.search(/illusion/i);

document.write(“Desired String is present at position : ” + position);

</script>

Output:



How to find the number of occurrences of a particular word or a string in a given string or paragraph
How to find the number of occurrences of a particular word or a string in a given string or paragraph

The string position is 11 because JavaScript counts the first position of String as 0

Also read javascript or jquery articles:
SharePoint 2013 system status notifications

Different operations Using JQuery like hide show disable and set specific value to html control

Get and Set Variable Values from One JavaScript File to another JavaScript File Using Local Storage

3. How to find a string and replace it with some other string?

We can achieve this by using a Regular Expression, regular expressions provides us the text replace functionality with its string method: replace() which replaces the specified string with the desired word or substring there by modifying the original string.

We can use the replace() method with either regular expression or string as an argument.
Code:

a. String as an argument

<script language=”javascript”>

var strng;

strng = “Is time an illusion created within our minds?”;

document.write(“Original String : ” + strng + “<br\><br\>”);

var modifiedStrng = strng.replace(“created”,”brainwashed”);

document.write(“Modified String : ” + modifiedStrng + “<br\><br\>”)

</script>

b. Regular Expression as an argument

<script language=”javascript”>

var strng;

strng = “Is time an illusion created within our minds?”;

document.write(“Original String : ” + strng + “<br\><br\>”);

var modifiedStrng = strng.replace(/CREATED/i,”brainwashed”);

document.write(“Modified String : ” + modifiedStrng + “<br\><br\>”)

</script>
Output:

How to find the single or multiple paragraphs which have the required word or string
How to find the single or multiple paragraphs which have the required word or string

4. How to find the number of occurrences of a particular word or a string in a given string or paragraph?

In this case we will use the indexOf() Method in JavaScript to find the number of occurrences of desired word or substring.

Code:
<script type=”text/javascript” language=”JavaScript1.1″>

var posn = 0;

var numbr = -1;

var j = -1;

var para = “Is time an illusion created within our minds? Or is it a dimension of the physical universe? Either way,time largely defines the human experience.”;

var findWord = “time”;

while (posn != -1)

{

posn = para.indexOf(findWord, j + 1);

numbr += 1;

j = posn;

}

document.write(para+”<br\><br\>”)

document.write(“There were ” + numbr + ” occurrences of ”” + findWord + “” in that paragraph.”);

document.close();

</script>

The code has a while loop to Search the substring or the word and count the number of occurrences

Output:

javascript and jquery string operation
javascript and jquery string operation

Occurrences of any Substring or Word can be obtained just by passing it into the code, in the findWord variable in this case.

var str = “Hello world, welcome to the universe.”;
var n = str.includes(“world”);
document.getElementById(“demo”).innerHTML = n;

5. How to find the single or multiple paragraphs which have the required word or string?

In this case we will use the contains() Method in JQuery to find the single or multiple paragraphs which contain the desired word or substring. Here we have used 4 paragraphs for demonstration and two paragraphs are given same class names for giving an idea about the code functioning.

Code:
<p class=”p1″>Is time an illusion created within our minds?</p>

<p class=”p1″>Or is it a dimension of the physical universe?</p>

<p class=”p2″>Either way, time largely defines the human experience.</p>

<p class=”p2″>Telling time is an essential early math skill.</p>

<script src=”https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js”></script>

<script>

$(document).ready(function(){

$(“.p1:contains(time)”).css(“background-color”, “yellow”);

$(“.p2:contains(time)”).css(“background-color”, “aqua”);

});

</script>


Output:

string operation using javascript or jquery
string operation using javascript or jquery

Hope this article was helpful.


You May Also like the Following SharePoint Online Tutorials:

About Akash Kumhar

I am Akash Kumhar a SharePoint Consultant.

View all posts by Akash Kumhar →

Leave a Reply