Open operators.html from beginnersite and save it in intermediatesite as conditions.html.  Delete all of the functions apart from the first one.

You are about to add extra conditions to the if statement.

All functions

Change the message in each alert inside the function:

The first line inside each function creates a variable and assigns a value to it.  Create a second variable the same way called sara and assign the value 5 to it.

Copy the function below itself three times so you have four in total.

In the HTML delete some paragraphs leaving just the first four.


Change the name of the first function to andOperator.  Now change the condition for the first if statement to this:

if (fred==3 && sara==4) {

Below find the first paragraph and change it so that it calls the first function with it's new name.  Also change the words inside the paragraph so you have this:

<p onmouseup="andOperator();">Using the &amp;&amp; operator</p>

You should be able to predict that when you click on the first paragraph it will report false.  Try it to check.  The variable fred does contain 3 but sara does not contain 4.  The && operator (known as AND in logic) means both must be true for the overall answer to be true.  You might use this to check that a username and password were both correct.


Make similar changes to the second function:

  1. call it orOperator
  2. change the && to || (be careful not to use ¦¦ by mistake)
  3. change the second paragraph to match

This time it is true because fred is equal to 3 although sara is not equal to 4.  If either one of them is true the condition is true.  With && both must be true.  With || either can be true for the if to return true.


Rename the third function combined1.  Make the condition like this:

if (fred==4 && sara==4 || sara==5) {

Amend the paragraph.  You might be unsure what the result will be which is good because neither is your browser.  It could mean:

When you try it the first two checks are meaningless because sara is 5 so the end result is true.

To make sure that the browser knows what you mean you use extra brackets (make the fourth function like this and call it combined2:

if (fred==4 && (sara==4 || sara==5)) {

The bit inside the extra brackets is evaluated by the if function first (and is true).  Then it checks to see if fred is 4 (false).  Finally it looks at the two answers and because of the && the overall result is false.