Main > JavaScript Tutorials

Latest Tutorials

Preloading images and executing code only after all images have loaded
See how to refine the process of preloading images to detect when all images have actually been preloaded and react accordingly.

Setting CSS3 properties using JavaScript
With the numerous CSS vendor prefixes one has to contend with when it comes to defining CSS3 properties such as -moz-box-shadow or -webkit-border-radius, setting them in JavaScript can be even more confusing. This tutorial looks at how to how to streamline the setting of CSS3 property values in JavaScript, by checking for and targeting only the version of a CSS3 property the browser supports.

Going beyond cookies- Using DOM sessionStorage and localStorage to persist larger amounts of info
HTML5 introduces DOM Storage, a new way of storing data on the client side that overcomes the disk space limitations of JavaScript cookies. This tutorial looks at how to take advantage of DOM Storage in browsers today.

Using document.createElement() to test for browser support for an element
Most of us are familiar with using object detection or the Navigator object to check for backing for a given JavaScript object or method, but these techniques do not work well when the objective is to check whether the browser supports a particular HTML element, such as the <canvas> element. This is where document.createElement() can be very helpful.

The onmousewheel event of JavaScript
The onmousewheel event fires whenever the user moves the mouse wheel either upwards or downwards, and can provide yet another way for users to interact with your JavaScript. In this tutorial, lets see how to take advantage of onmousewheel across browsers.

Handling runtime errors in JavaScript using try/catch/finally
The try/catch/finally statement of JavaScript lets you dip your toes into error prune territory and "reroute" when a runtime error has occurred. Learn all about this often misunderstood statement in this tutorial.

Dynamically loading an external JavaScript or CSS file
External JavaScript or CSS files do not always have to be synchronously loaded as part of the page, but dynamically as well. In this tutorial, we'll see how to load, remove, and replace external JavaScript and CSS files on demand and asynchronously. It the era of Ajax, it's a handy thing to know.

JavaScript and memory leaks
If you're not careful, your JavaScript code may leak memory and sometimes even bring the visitor's browser to its knees. This tutorial looks at different leak patterns in JavaScript and how to fix them.

JavaScript Closures 101- they're not magic
Morris Johns explains JavaScript closures, a powerful yet often bewildering concept, in a gentle, step by step fashion.

Conditional Compilation of JScript/ JavaScript in IE
IE supports a little known feature called conditional compilation that selectively compiles any block of JScript or JavaScript depending on your script logic. Think of it as the absolute form of object detection.

External JavaScript and PHP
External JavaScript can reference not just .js files, but PHP scripts as well. See how this is done, and the wonderful possibilities linking PHP to JavaScript bring.

Changing Select element content on the fly
This tutorial explains how to change a select element's content using JavaScript, from adding new options to modifying and deleting them. It also shows how to create a 2 level interdependent select list.

Determining cookie support in client's browser
If your script relies on JavaScript cookies to store and persist information, it's a good idea to always first make sure the user's browser has cookies enabled. This tutorial shows you how to perform this detection.

Sorting and filtering a Tabular Data Control
A Tabular Data Control can easily be sorted and filtered before its data is shown on the page. The following two tutorials examine this:
- Sorting a Tabular Data Control
- Filtering a Tabular Data Control

Introduction to Tabular Data Control (IE)
Tabular Data Control is a Microsoft ActiveX control that comes pre-installed with all versions of IE4+. This useful control allows you to access, display, and sort ASCII information stored on the server end, such as a .txt file. In other words, it creates a simple client side "database." Learn about TDC and how to use JavaScript to manipulate it in this tutorial.

Introductory Guide to Regular Expressions
Always wanted to learn about Regular Expressions in JavaScript? With this comprehensive yet gentle tutorial on the subject, you'll be on your way to slashing and validating string input using Regular Expressions in no time! 

Programmer's Guide to Regular Expressions
Concise, to-the-point tutorial on Regular Expressions with sections on more advanced aspects of the feature.

JavaScript and Object Oriented Programming (OOP)
JavaScript may not be known for its object oriented properties, but it does support most of the features required to be considered an Object Oriented language. See how to write OOP code in JavaScript.

Tutorial Index

.
Introductory Tutorials JavaScript Primer Creating alert, confirm, and prompt boxes Understanding "event handlers" in JavaScript One event handler, many actions Adding more than one JavaScript to a page The Type and Language attributes of JavaScript How I learned JavaScript Forms and form validation Accessing and validating forms Manipulating radio and check boxes Enabling/ disabling form elements Accessing the select element of a form Creating combo link menus Changing select element content on the fly External JavaScript Creating external JavaScript libraries External Javascript and PHP Dynamically loading an external JavaScript or CSS file Restricting access of JavaScript libraries to designated domains JavaScript cookies Session-only cookies Determining cookie support in client's browser Math & Random scripts The Math object Number rounding in JavaScript Formatting numbers for decimals and significant digits Generating a random number in JavaScript Generating weighed random numbers Using JavaScript to create random scripts Randomizing the display order of content using JS Variables and functions Determining the existence of a variable Robust functions via the arguments array Using named arguments in JavaScript functions Variable and expression shortcuts The switch statement of JavaScript Adding properties to a literal in JavaScript Avoiding variable and function conflicts in JavaScript Flag Variables, Validation, & Function Control Tackling JavaScript strict warnings Regular Expressions Introductory Guide to Regular Expressions Programmer's Guide to Regular Expressions JavaScript with content Using JavaScript to statically display elements JavaScript and Dynamic Content Creating an attractive Hover Menu using CSS & JavaScript Programming the <marquee> tag of IE Dynamic Overlay- Putting an entire web site on a single DHTML file		Date & Time Date, time, and creating a live clock in JavaScript Calculating the difference between two dates Y2K and your date scripts Interacting with images Accessing images & creating image rollovers Preloading images and executing code only after all images have loaded Creating depressible images Building a JavaScript image slideshow Windows and frames Windows and JavaScript Determining whether a browser window is open Moving, scrolling, and resizing browser window Loading two frames with one link... Opening windows in theatre and channel mode (IE) Creating window remote controls Detecting user's screen size and resolution Strings (text) Strings in JavaScript Part 1 Strings in JavaScript Part II Arrays and loops Understanding basic arrays and loops Understanding dense arrays Defining arrays & multi-dimensional arrays using literal notation Creating a custom two-dimensional array Sorting an array using the sort() method Objects and entities JavaScript and OOP Creating custom objects in JavaScript The prototype object of JavaScript Sending objects from one page to another JavaScript entities (obsolete) Browser and features detection Using the navigator object to detect browser Using object detection to detect browser type Using document.createElement() to test for browser support for an element Error handling The onerror event of the window object Handling runtime errors in JavaScript using try/catch/finally Keyboard and printer interaction Scripting the keyboard in JavaScript onbeforeprint and onafterprint events of IE Using window.print() to print a document Tabular Data Control (IE only) Introduction to Tabular Data Control Sorting a Tabular Data Control Filtering a Tabular Data Control Other tutorials Performance tips for JavaScript Introduction to the DOM of IE6 / Firefox Overview of scripting in modern browsers such as IE6 / Firefox Creating custom collections in the DOM (via ID attribute) Creating customizable alert boxes using VBScript