Are you new to JavaScript, or trying to learn advanced techniques? These tutorials will show you step by step how to create and add JavaScript code to any Web page. There are also many advanced tutorials to enhance your understanding of the language. For Ajax instructions, see our Ajax tutorial section.
Title:JSONVid: Pure JavaScript Video Player Contributor: Jacob Seidelin Date Posted: May 5, 2008 Description:
Jacob Seidelin went on a mission to create a pure JavaScript video player that didn't use Flash. The result: JSONVid.
Title:An Introduction to JavaScript Object Notation (JSON) Contributor: Rob Gravelle Date Posted: April 23, 2008 Description:
JavaScript Object Notation, or JSON for short, is a lightweight data-interchange format which may prove to be a viable alternative to XML for IT developers. It's easy to read and write by people as well as for machines to parse and generate.
Title:Advanced JavaScript Debugging Techniques Contributor: Mike Wilcox Date Posted: April 14, 2008 Description:
The purpose of this tutorial is to provide a list of advanced debugging techniques that are not easily found elsewhere on the web. We all worship at the altar of Firebug, but there are things that can go beyond a console.log().
Title:Learn How to Use and Get the Most out of Regular Expressions Contributor: Jan Goyvaerts Date Posted: April 7, 2008 Description:
This tutorial is quite unique because it not only explains the regular expression (regex) syntax, but also describes in detail how the regex engine actually goes about its work.
Title:Using CSS and Mootools to Simulate Flash Horizontal Navigation Effect Contributor: Antonio Lupetti Date Posted: April 2, 2008 Description:
This tutorial explains how to use Mootools and pure CSS/HTML code to simulate a Flash horizontal navigation effect. Easy to implement, with complete source code.
Title:JavaScript Metaclass Programming Contributor: Neil Roberts Date Posted: March 19, 2008 Description:
In this tutorial series, Neil Roberts looks at metaclass programming and how to implement it in JavaScript. Metaclass programming is the programming that builds a class. Since most of the time a metaclass simply takes an already declared class and manipulates it, you can think of a metaclass as a template: a class goes in, and a specifically structured class comes out.
Title:How to Create Remote AJax Requests Contributor: Kris Hadlock Date Posted: February 21, 2008 Description:
One of the most common questions about Ajax is whether it's possible to create remote or cross-domain Ajax requests. The answer is yes and in this tutorial you'll learn how to create an Ajax-enabled podcast aggregator with PHP and Ajax.
Title:API Developer's Guide: JavaScript Contributor: Google Date Posted: February 11, 2008 Description:
This document describes how to use the JavaScript client library to send Google data API ("GData") queries and interpret returned responses.
Title:Eloquent JavaScript Contributor: Marijn Haverbeke Date Posted: February 1, 2008 Description:
This is a comprehensive introduction to the JavaScript programming language. In addition, it also contains plenty of example programs, and a console to try them out and test them.
Title:Using Multiple JavaScript Onload Functions Contributor: Lee Underwood Date Posted: January 25, 2008 Description:
When using multiple scripts, often they are executed using onload event handlers. This can sometimes be a bit tricky if more than more is used. Check out this easy, fool-proof method for use with your scripts.
Title:A Practical Guide to Numbers in JavaScript Contributor: Greg Burghardt Date Posted: December 5, 2007 Description: Dealing with numbers, strings and JavaScript can be frustrating for a beginner. This is a down-and-dirty explanation of converting strings to numbers, detecting if a string is a number, and handy functions for manipulating numbers.
Title:Are You Ready for This? Contributor: Patrick Hunlock Date Posted: October 26, 2007 Description: This tutorial takes you through a page's ready states and shows how to write JavaScript code to determine when a page's DOM elements are loaded and available.
Title:JavaScript, DOM, and the Humble Form Contributor: Greg Burghardt Date Posted: October 19, 2007 Description: So you've got a form on your Web page, and now you want JavaScript to interact with it. This tutorial outlines the various methods used when scripting forms, and explains the Form Document Object Model in detail. Includes code examples of the two main methods with an emphasis on Web standards and best practices.
Title:Loading Two or More Frames Simultaneously Contributor: Will Bontrager Date Posted: September 12, 2007 Description: When you have a framed site and want to load content into two or more frames when only one link is clicked, JavaScript can be used to accomplish it.
Title:Browser Detecting (and What to Do Instead) Contributor: Richard Cornford Date Posted: September 4, 2007 Description: Browser detection has proven unreliable. An alternative strategy is known as object or feature detection. This tutorial examines why browser detection does not work, and looks at how to implement feature detection.
Title:Understanding the JavaScript RegExp Object Contributor: Harish Kamath Date Posted: August 22, 2007 Description:
Need to match and replace patterns on a Web page? JavaScript can do the job quite well. This tutorial will teach you how, with an introduction to the JavaScript RegExp object and its methods.
Title:A Personalized "Thank You" Page Contributor: Will Bontrager Date Posted: August 15, 2007 Description:
This tutorial will show how to create a personalized "thank you" page for all of your forms. The method described here is accomplished with JavaScript and cookies.
Title:Effectively Requiring Cookies With All Browsers Contributor: Will Bontrager Date Posted: May 9, 2007 Description:
If you have any Web pages that must not be viewed unless a certain cookie is set, this article contains the means to make it so. The article sidesteps the argument that restricted content can be viewed simply by turning off JavaScript. It will show you how to redirect browsers to a different page if they don't have JavaScript turned on.
Title:The Perfect Pop-Up Contributor: Ian Lloyd Date Posted: March 26, 2007 Description:
If you believe the likes of Jakob Neilsen and his supporters, nothing is more evil than pop-up windows. And in many ways, this is correct. Why? Well, we'll list the reasons soon enough, but in a nutshell it's because they are nearly always poorly implemented or simply not needed. This tutorial will show that, with the right thought, pop-up windows can be used without upsetting anyone - particularly the person browsing your site.
Title:String Concatenation and String Operators Contributor: Jennifer Madden Date Posted: March 14, 2007 Description:
Concatenation is the process of combining two or more separate strings together to form one string. You can also use string operators to break up a long string into multiple strings to make your source code more readable. This tutorial explains how to use both procedures.
Title:The JavaScript Array: Definition and Syntax Contributor: Jennifer Madden Date Posted: February 15, 2007 Description: A JavaScript array is a beautiful thing. It is a little database holding any given type of information, and is easily accessible to you and your scripts. To understand each part of an array, this tutorial examines custom arrays and DOM arrays.
Title:Attributes > Classes: Custom DOM Attributes for Fun and Profit Contributor: Pete Forde Date Posted: January 12, 2007 Description: XHTML gives the ability to extend markup with customized, semantically meaningful attributes. The battle between classes and attributes might be a holy war to some and unknown to most others. To clear things up, this article gives several examples and provides functions for working with your own custom attributes.
Title:JavaScript Cheat Sheet Contributor: Dave Child Details: Posted June 15, 2006 Description: The JavaScript cheat sheet is designed to act as a reminder and reference sheet, listing methods and functions of JavaScript. It includes reference material for regular expressions in JavaScript, as well as a short guide to the XMLHttpRequest object.
Title:Scaling an Image Contributor: Santhi Maadhaven Details: Posted June 6, 2005 Description: Sometimes you need to resize an image according to the window's size. You can accomplish this using the JavaScript clientWidth and clientHeight object properties.
Title:Core JavaScript Reference: Version 1.5 Details: 236 Kb * Posted May 9, 2005 Description: This downloadable book (in HTML format) is a reference manual for the core JavaScript language, version 1.5. Can be used in conjunction with the Core JavaScript Guide, listed below. Download the file, unzip it, and open the "contents.html" file. Written by the developers at Netscape Communications. An excellent resource.
Title:Core JavaScript Guide: Version 1.5 Details: 1 MB * Posted April 27, 2005 Description: Starting at the beginning, this downloadable book (in HTML format) explains everything you need to know about using core JavaScript. This book assumes you have the following basic background: a general understanding of the Internet and the World Wide Web and a good working knowledge of HTML. Download the file, unzip it, and open the "contents.html" file. Written by the developers at Netscape Communications. An excellent resource.
Title:The JavaScript Diaries Contributor: Lee Underwood Details: Posted April 18, 2005 Description: JavaScript is a versatile language which can enhance your Web site. This is an ongoing series on the process of learning JavaScript, starting from the very beginning.
Introduction: JavaScript is a versatile language which can be used to create menus, validate forms, provide interactive calendars, post the current day's headlines, track a visitor's history on your site and much more. This installment is part one of an ongoing series on the process of learning JavaScript.
Data Types & Variables: In this installment we delve into parts of the language and also write our first script.
Operators: This installment takes a look at JavaScript operators, which are used to accomplish many different tasks. Some of the topics covered are mathematical operators, comparison operators, assignment operators, logical (boolean) operators and much more.
Functions: In this section, we take a look at JavaScript functions. These help us to write more intricate programs. A sampling of topics includes writing functions, naming rules, calling a function, global and local variables and more.
Conditional Statements and Loops: This week, as we continue our quest to learn the JavaScript language, we'll look at conditional statements and loops. These can help us to add more depth and complexity to our scripts.
Objects: In this installment we go a little deeper into our study of JavaScript. Some of the topics covered here include JavaScript objects, object properties and methods, and the constructor function.
Browser-Based Objects: In our last installment we looked at how to create custom-made objects using the Object() constructor. This installment continues that study by taking a look at browser-based objects.
Window Methods: Moving ahead in our study, in this installment we look at the methods that are associated with the window object and how they work. Until now, we've been learning how to build the framework of our scripts but now we'll start to see things happen! Using these methods you'll learn how to begin to implement JavaScript in your Web sites.
Window Event Handlers: In the last two sections of this series we looked at properties and methods of the window object. In this installment, we wrap up our study of the window object by learning how to use the most common window event handlers. There are also some excellent links for additional help.
Navigator, Screen, History and Location Objects: There are four objects that provide information about the environment of the user's system. They belong to the window object: navigator, screen, history and location. These objects are used to obtain information such as screen size and resolution, color depth of the monitor, limited information on the browser history, the URL and more.
Arrays: Part 1 - Introduction: In our continuing JavaScript saga, this installment takes a look at JavaScript arrays, which can be very useful in creating different types of scripts. This study will span several installments due to its complexity.
Arrays: Part 2 - Multiple Array Types: This installment takes a look at multidimensional and associative arrays. As you learn to use these you'll begin to understand how they can be incorporated into your Web sites.
Arrays: Part 3 - Array Properties and Methods: Now that we know about the different types, we'll learn how to manipulate them in order to make them more functional. This installment takes a look at the properties and methods that are commonly used for most coding situations.
The Math Object: This installment looks at the Math object, a JavaScript object used to perform mathematical operations such as obtaining the values of predefined mathematical constants. It can also be used to generate random numbers.
Title:Basic Date Display Script Contributor: Lee Underwood Details: Posted April 4, 2005 Description: Would you like to display the current date on your Web pages? One option is to use JavaScript. This tutorial shows you how to implement an existing script. The script itself also comes with comments so you can understand how the whole process works.
Title:Creating an Autosuggest Textbox with JavaScript: Part 1 Contributor: Nicholas C. Zakas Details: Posted March 21, 2005 Description: One of Google's new applications is Google Suggest. As you type, Google suggests search terms that come up with results. While not a new implementation, it's quickly becoming popular among developers. This installment will teach you how to build an autosuggest control one step at a time.
Title:Creating an Autosuggest Textbox with JavaScript: Part 2 Contributor: Nicholas C. Zakas Details: Posted June 6, 2005 Description: In the first part of this series, you learned how to create type ahead functionality in a textbox, which presents the user with a single suggestion for what they've already typed. This article builds upon that functionality by adding a dropdown list of multiple suggestions.
Title:Creating an Autosuggest Textbox with JavaScript: Part 3 Contributor: Nicholas C. Zakas Details: Posted June 6, 2005 Description: In the second part of this series, you learned how to add a dropdown suggestion list to the autosuggest control. This week you'll learn how to complete the modifications, make your suggestions case insensitive and get the suggestions back from the server instead of using client-side information.
Title:WebReference JavaScript Articles Details: Posted March 1, 2005 Description: This is a listing of JavaScript articles appearing on the WebReference.com Web site. They range from beginner to expert.
Title:DevX JavaScript Articles Details: Posted March 1, 2005 Description: This is a listing of JavaScript articles appearing on the DevX.com Web site. They range from beginner to expert.
Title:FrontPage 2000 Details: Posted July 26 2000 Description: Shows you step-by-step how to add JavaScript code from The JavaScript Source to your page within FrontPage 2000.
Title:JavaScript Tutorial Contributor: Aaron Weiss Details: Posted October 16 2000 Description: This JavaScript tutorial is aimed primarily at those who have had at least some exposure to another programming language. It is not our purpose here to cover the basic concepts of computer programming, but rather illustrate the syntax and methodology of JavaScript. For its part, JavaScript is a rather basic language which conforms tightly to the core concepts of computer programming. Any background in programming, from Visual Basic to Pascal to C (which is far more advanced) is sufficient to readily understanding JavaScript.
How did these tutorial work for you? What could we do to make it better? What other tutorials would you like to see here? Your tutorial feedback is very much appreciated.
Jupitermedia's Database Journal offers SQL courses and other database related resources for beginner to expert developers.