Larry Ullman

Translating Geek Into English

Getting Started with jQuery

2 mins to read

For some time now I’ve been meaning to write about jQuery, an increasingly popular JavaScript framework. There are a number of JavaScript frameworks available, all with their own strengths and weaknesses, so I don’t want to suggest that jQuery is the best one, but it does have its advantages. In particular, I like:

  • that there’s only one file to include in a page
  • how simple DOM (Document Object Model) references are, as manipulating the DOM is such a large part of Rich Internet Applications
  • the unobtrusive JavaScript approach

If you’re not familiar with this last concept, it involves keeping the JavaScript together, in the page’s HEAD, separate from the HTML. Pretty much anytime you separate X from Y (data from presentation, HTML from PHP, CSS markup from HTML, etc.), it’s a good thing. At the very least, abiding by unobtrusive JavaScript makes editing JavaScript easier. (There’s more to unobtrusive JavaScript than just this but…)

In this first post on jQuery, I’ll just discuss how to prepare a page to use jQuery. Over the next few days, subsequent posts will demonstrate more complex applications of jQuery.

\[javascript\]\[/javascript\]\[javascript\]\[/javascript\]\[javascript\]\[/javascript\]

This syntax is a bit strange, so I’ll explain. The $(document) part is an identifier, one that specifically refers to the document. On the document object, the ready() method is called. This method takes one argument: the function to be called when the document becomes ready. In this code, an anonymous function is defined. Anonymous functions in JavaScript are quite common; they have no names, are defined in situations where a function’s name or definition is expected as an argument, and they are never called directly (because they have no name). The last line of that code first closes the function definition, then the parentheses for the ready() method, then the semicolon terminates the line.

\[javascript\]\[/javascript\]\[javascript\]\[/javascript\]

The focus in this article has really been a basic introduction to jQuery, specifically how to use it in a Web page. Later posts (to be linked here once created) will use jQuery for more interesting purposes. In the meantime, you may want to read Sitepoint’s interview with jQuery’s creator, John Resig, and bookmark Visual jQuery, an excellent resource for the jQuery framework (although it won’t mean much to you now).