A brief introduction to JavaScript

Javascript is another scripting language. It is recognized and executed by most browsers. The main distinction between php and javascript is this:

PHP code is executed on the SERVER, it never reaches the client (browser), who just sees what's done by print statements.
JavaScript is ignored by the server, and sent to the CLIENT, where it can be executed (or not.)

As a result, Javascript can do different things. It cannot access resources on the server, but it can respond immediately and locally to what the user of the browser does. In particular, javascript can respond to events, such as:
Click, Change, MouseOver, Submit (of a form)

How does it differ from PHP?

The syntax is basically the same. All the funny symbols you learned: =, ==, !, &&, etc. are the same. if, function ...

Except you concatenate strings with + , not dot(.)
Variable names do NOT start with $. As a result, they can't be recognized inside "quotes". Declare them like this:
```
var myname = "J. K. Rowling";
```
Sorry, no foreach loop. You'll need to learn while and for
It is based on objects. Objects have properties that are refered to with a dot notation. These can be other objects, in turn with their own properties.
Example: document.myform.email.value is the current value appearing in the input named email of myform, that is part of the current document.
You do not print. Instead, the document has the property (technically, method) of write() For example, to write: Harry Potter, created by J. K. Rowling:
```
document.write("Harry Potter, created by " + myname);
```

Where do you put Javascript in an HTML document?

Between <script> ... </script> tags. Wherever you want to write something (usually variable). In the <head> section where you are not writing, for instance, for declaring a function.
It is possible that your javascript will be ignored. Clients can disable javascript entirely, if you use it to bother them. So you may need to provide alternatives. This is done between
<noscript> .. </noscript> tags, where you put HTML that will only be rendered when javascript cannot be executed. Example:

<script>
	document.write("Hello from " + myname);
</script>
<noscript>
	Hello from me
</noscript>

You can also put javascript inside html tags, The javascript, whatever it is, will be carried out when the event happens. For instance:

<em onMouseOver="this.style.color='red'"
    onMouseOut="this.style.color='blue';"> try this </em>

What does this do? Well, try this now. But avoid clicking on this.

3 popup boxes

For getting input from a user, there are 3 Javascript functions that pop up a box. Each takes one argument, a string that will be displayed in the box. They are:

alert( message ) -- Gives some information, warning, etc. User clicks OK to make it go away.
confirm( question ) -- Asks a question, and returns the value true or false depening on users response.
prompt( whatfor ) -- presents a text box for some input, such as a name that can then be written into the page.

Finding your errors!

If your script is "not working" it may be that there is an error. You might expect an error message, as we got in PHP. But, browsers do not show Javascript errors, because your user will not like to see them. (In the early days error messages were really "In your face.") So, open the Console (shows Javascript and CSS errors)

Firefox: (bars-icon on right) More Tools | Web Developer Tools. Choose the Console tab, see that "error' at least is selected. (depends on version)

(below here I haven't tried to check lately.)

Seamonkey: Tools | Web Development | Error Console
Chrome: (bars-icon on right) | More Tools | JavaScript console
Konqueror, Epiphany: not available, use Firefox.
IE: Tools | Internet options | Advanced, then UN-click the box, "disable error checking (internet)"
Safari: Develop | Show Error Console
(if no Develop menu item: Safari | Preferences | Advanced | click box ◻ "Show Develop Menu" )

Open the console and try:

Click on this line to provoke an error

The error might even be detected before you click on the line
the line in question contains:

onclick="alert('this is invalid' Javascript) varx=2+;"

You might want to clear the console initially, and reload the page you are debugging -- There are usually a lot of errors from "professional" pages! The Console tries to show you exactly where an error is detected. Remember, the actual mistake may be several lines before.

What next?

An important use of Javascript is to check a form for required elements and reasonable values. We will discuss this at length in the next chapter.