JQuery_ Novice to Ninja - Earle Castledine [8]
To make it all work, we need to tell our HTML file to include the jQuery library. This is done by using a script tag inside the head section of the HTML document. The head element of a very basic HTML file including jQuery would look a little like this:
The first script tag on the page loads the jQuery library, and the second script tag points to a script.js file, which is where we’ll run our own jQuery code. And that’s it: you’re ready to start using jQuery.
We said earlier that downloading the jQuery file is the most common approach—but there are a few other options available to you, so let’s have a quick look at them before we move on. If you just want to start playing with jQuery, you can safely skip the rest of this section.
The Google CDN
An alternative method for including the jQuery library that’s worth considering is via the Google Content Delivery Network (CDN). A CDN is a network of computers that are specifically designed to serve content to users in a fast and scalable manner. These servers are often distributed geographically, with each request being served by the nearest server in the network.
Google hosts several popular, open-source libraries on their CDN, including jQuery (and jQuery UI—which we’ll visit shortly). So, instead of hosting the jQuery files on your own web server as we did above, you have the option of letting Google pick up part of your bandwidth bill. You benefit from the speed and reliability of Google’s vast infrastructure, with the added bonus of the option to always use the latest version of jQuery.
Another benefit of using the Google CDN is that many users will already have downloaded jQuery from Google when visiting another site. As a result, it will be loaded from cache when they visit your site (since the URL to the JavaScript file will be the same), leading to significantly faster load times. You can also include the more hefty jQuery UI library via the same method, which makes the Google CDN well worth thinking about for your projects: it’s going to save you money and increase performance when your latest work goes viral!
There are a few different ways of including jQuery from the Google CDN. We’re going to use the simpler (though slightly less flexible) path-based method:
It looks suspiciously like our original example—but instead of pointing the script tag to a local copy of jQuery, it points to one of Google’s servers.
Tip: Obtaining the Latest Version with Google CDN
If you look closely at the URL pointing to Google’s servers, you’ll see that the version of jQuery is specified by one of the path elements (the 1.4.0 in our example). If you like using the latest and greatest, however, you can remove a number from the end of the version string (for example, 1.4) and it will return the latest release available in the 1.4 series (1.4.1, 1.4.2, and so on). You can even take it up to the whole number (1), in which case Google will give you the latest version even when jQuery 1.5 and beyond are released!
Be careful though: there’ll be no need to update your HTML files when a new version of jQuery is released, but it will be necessary to look out for any library changes that might affect your existing functionality.
If you’d like to examine the slightly more complex “Google loader” method of including libraries, there’s plenty to read about the Google CDN on its web site.
Nightlies and Subversion
Still more advanced options for obtaining