There are a number of methods associated with string objects in JavaScript.  Which one you use depends on what you want to get back.


This will hunt for some text inside the object.  Add these lines under the three already inside the script element in string.html:

var matchResult=myString.match('lo');

Save and try.  Then change lo to zz inside the match method brackets.  Try it again and you should get a different response. 

You can use these responses in an if statement (to ask if a longer string contains a specified smaller string).  Under the alert line add:

    alert('It matched');
} else {
    alert('No match');

The condition of the if statement will look to see if lo is in the string.  If it is that first message will show because the match function returned a positive answer.  If not the search functions returns a negative (actually a null or non-existent value which is taken to mean false).  That causes the other message to show.

Try the page matching zz and lo to be sure that the if is working properly.

If the first alert (11) is annoying you get rid of it by commenting out the third line of code (just put // in front of it as it is just one line).  It is useful to leave it there for reference if you ever look at your code later.  You might also want to comment the rest of code to explain what it is doing.


Search does the same but sends back (returns) the position of the string when found.  Comment out the existing matchResult line and it's if statement if you want to avoid lots of messages (/* and */ would be easiest this time).  You can copy those lines below themselves or type them new (the structure is the same but they all need to change):

  1. the first line needs to be the same apart from changing the word match (twice) for search
  2. the if statement structure is the same but:
    1. change matchResult to searchResult so that the variable name is the same as the previous line
    2. leave the alert message the same for the if it is null choice
    3. change the other alert line inside the else by deleting the quotes and what is in them and replacing that with searchResult (no quotes around variables remember)

Try it with matching and non-matching searches.  You will see the position in which the small string was found but notice there is a problem.  Rather than returning null when the string is not found the search method returns -1.  That means you need to change your if statement a bit more.  After the == put -1 (minus one) instead of null.  Still no quotes needed as it is a number.  Try it again and it should work now.  Note that the position of the found string is the starting position.  The search method does not bother to look for more than one match.


This works exactly the same way but allows you to say where to start the search.  Our string is so short it doesn't seem worth it but in longer strings it is.  Also it can be used to find the start and end of something or to match multiple occurrences. 

You now have a block of code demonstrating match, one for search and this one will show indexOf.  The code might confuse you next time you look.  You should add comments to say what each one does (like headings above each one).  This code should be pasted below the other code and already comes with some comments to explain it:

// this shows indexOf
/* the longer string might be part of a page using a name in it but when you code it you don't know what name
(maybe it came from PHP and a database) */
var longerString='Hello there <span>Fred</span> are you happy today?  I hope so.';
			// this finds the start of the <span> string search from the beginning (the first character is character 0)
var indexStartResult=longerString.indexOf('<span>', 0);
// the next line shows a message witht he starting position	    	
alert('Starting position is '+indexStartResult);
			// this searches from the end of the <span> (by adding 6 - the length of <span>) until it finds the start of the </span> closing tag
var searchStart=indexStartResult+6;
var indexEndResult=longerString.indexOf('</span>', searchStart);
alert('End position is '+indexEndResult); 	

There is no use for this yet but that comes next.  Once you have found the position of some things you can change them or delete them.