Learning JavaScript

This web site is all about adding dynamics to our web pages using JavaScript and jQuery. In this section of the site we focus on JavaScript version 1.5, that is usable in all modern browsers, which will lead us nicely into using jQuery.

You need to have an understanding of how HTML and CSS work to get the most benefit from these tutorials. Visit the HTML Doctor web site for in-depth tutorials on the HTML and CSS disciplines as well as a comprehensive reference section.

What is JavaScript?

JavaScript is an object oriented, event driven scripting language that works on multiple platforms and allows us to add dynamics to our web pages. Whereas HTML is all about the structure and CSS the presentation, JavaScript allows us to change the behaviour of elements. Unlike server-side languages, such as PHP, which have to communicate with a web server before actioning events, JavaScript responds immediately in client side mode, leading to much faster response times for users.

In the following tutorials we will start with the basics and gradually introduce more advanced topics as we move through the lessons. We will ensure that we keep the HTML (structure), CSS (presentation) and JavaScript (behaviour) separated from each other to conform to best practice.

JavaScript Basics

In these basic lessons we start by writing a simple 'Hello World' program in JavaScript. Following on from our simplistic 'Hello World' program we look at JavaScript Syntax and the anatomy of the 1.5 version of the language. We then examine the various ways we can insert JavaScript into our HTML. After this we look at basic maths functions creating variables using the var statement. After this we take our first look at some of Javascripts predefined objects by looking at the Object and String objects and some of the methods associated with them. We finish the basics section by examining booleans and the Boolean object.

JavaScript Intermediate

We start the intermediate section by looking at arrays and the Array object and some of the methods. We continue our look at some of JavasScripts predefined objects by examining the Date object and some of the data and time methods available for use with this object. After this we take a first look at conditional statements with the if....else construct, before looking at the loop statements JavaScript offers us. We look at some more maths functions, compact our code by using object literals and functions, before finishing the intermediate section with a look at regular expressions.

JavaScript Advanced

In these advanced lessons we start by taking at look at some more conditional statements and then see how to utilize JavaScripts error handling. We then take a final look at maths by exploring the Number and Math global objects. After this we finish our three part lessons on object creation before looking at the domain object model and how to bring our pages to life with events. We then tackle the tricky subjects of function recursion and closures before finishing our study of Javascript by looking at the globals and functions not covered in previous lessons.

All the global objects, constructors, properties, variables and pre-defined functions, as well as statements and operators available in the JavaScript 1.5 version. This comprehensive reference section gives usage for each entity along with methods and properties where applicable.

Case Study

In this section of the website we utilise what we have learnt from the JavaScript and jQuery tutorials to create a case study. The case study consists of a proposal for an interactive quiz followed by lessons in which we create all the other components starting with the HTML and CSS and then adding the JavaScript and jQuery.

JavaScript & jQuery Quizzes

In this section of the site we utilise what we have learnt from the JavaScript and jQuery tutorials and test your knowledge with some interactive quizzes.