JavaScript Essential Training, by Simon Allardice on Lynda.com, provides an easy-to-understand video training series on JavaScript. The course begins at ground zero and proceeds through basic JavaScript programming concepts and techniques.

These pages on my site are notes from the course. Most of the code examples come the course, but I usually modify the styles and add my own comments and explanations about what's going on. I plan to continue adding and expanding my notes here as I advance with my learning of JavaScript.

What is JavaScript?

JavaScript is a programming language that runs in your web browser. It's considered one of the main building blocks of web pages, complementing CSS and HTML, and provides the interactive elements of a web page. When you see page elements expand or collapse, slide around, change appearance on mouseover or click, appear or disappear, change color, and so on, it's JavaScript that enables this interactivity.

JavaScript doesn't interact with your web server. All the action happens right in your browser, because your browser includes an engine to run and interpret JavaScript code.

A Basic Example of JavaScript

Here's the most basic example of a JavaScript statement:

 
<script type="text/javascript">
alert("Hello World");
</script>

When you run this JavaScript statement, an alert pops up in your browser that says, "Hello World."

Referencing JavaScript

When you integrate JavaScript in a web page, you enclose it in script tags. However, it's usually best not to mix your scripts with the HTML of your webpage. Instead, you insert the script in a separate .js file and then reference the js file on your web page. This makes it easier to write and maintain your JavaScript code.

To reference a JavaScript file, insert the following:

 <script src="scripts.js"></script>

You can also add type="text/javascript" but this isn't required.

 <script type="text/javascript" src="scripts.js"></script>

This reference will pull in the script file (assuming it's in the same folder as your webpage and called scripts.js). You can insert the reference to your JavaScript file anywhere on the page, but the script will load in sequence where you insert it.

In general, adding the reference to the script file before the closing body tag is a good idea, since this allows your web page content to load first. However, if you have scripts that need to load first, you would insert the script reference much earlier, such as in your head.

Basic JavaScript Syntax

Note a few basic syntax rules with JavaScript:

• Everything is case sensitive. "Alert" is different from "alert".
• Semicolons end a statement.
• Spaces don't matter except inside quotations.

Adding Comments

You add comments in JavaScript by adding two forward slashes at the beginning of lines, like this:

 //here's a sample comment
alert("Hello, World");

In general, add comments above the lines they refer to. You can also add comments to multiple lines using /* and */ just like you do in CSS:

 alert("Hello, World");
/*now we're going to write a long comment
that will span several lines like this, because we
have a lot to say.
*/

Because these are notes on JavaScript, I've added a lot of comments in the example code.